什么是特性模块？
在 Angular 应用程序中，特性模块是一种将应用程序分解为独立功能块的方式。每个特性模块包含了组成该功能块的相关文件（组件、服务、指令、管道、等等）。这种方式使得应用程序的代码结构更加清晰，并且可以更好地管理和扩展应用程序。特性模块还帮助我们将应用程序分割成小的代码片段，这样在编译时可以更快地生成捆绑包，并且用户访问应用程序时可以更快地加载。
为什么要使用特性模块？
特性模块使应用程序更易于管理、扩展和维护。它们可以将应用程序中的功能分组，使得在各个功能之间的依赖性更加清晰。例如，一个在线商店的电子邮件模块可能包含了所有与电子邮件有关的组件、服务和管道。如果我们需要在以后添加更多的电子邮件相关功能，我们可以轻松地将它们添加到该模块中，而不需要影响到应用程序的其他部分。特性模块还可以使得代码更为模块化和可重用。
如何创建特性模块？
我们可以使用 Angular CLI 的 generate 命令来创建一个特性模块。假设我们希望创建一个名为 customer 的特性模块，我们可以在终端窗口中输入以下命令：
ng generate module customer
这会在 src/app 目录下创建一个新的 customer 目录，并生成一个名为 customer.module.ts 的文件。我们可以在该文件中添加我们所需的组件、服务和其他类型的代码。
什么是懒加载？
懒加载是一种加载 JavaScript 代码的方式，在需要时再请求并加载代码，而不是在应用程序启动时就加载所有的代码。例如，在我们的在线商店应用程序中，我们可以在用户浏览商品列表时仅加载商品列表相关的代码，而不是在应用程序启动时加载所有的代码。
为什么要使用懒加载？
懒加载可以使应用程序更快地加载和渲染，因为它只加载需要的代码，并在需要时才执行代码。这可以使得我们在应用程序启动时加载更快，并减少用户等待时间。
如何使用懒加载？
我们可以使用 Angular 的 LoadChildren 属性来指定需要懒加载的组件。例如，我们可以将以下代码添加到我们的 app-routing.module.ts 文件中：
{
path: 'customers',
loadChildren: () => import('./customer/customer.module').then(m => m.CustomerModule)
}这告诉 Angular 在需要时加载 CustomerModule 模块。当用户访问 /customers 路径时，Angular 将加载该模块，并在模块中查找 CustomersComponent 组件。
总结
Angular 应用程序中的特性模块和懒加载是一种使应用程序更可管理、扩展和维护的方式。它们可以帮助我们将代码分成小的功能块，并在需要时加载代码，从而提高应用程序的性能和用户体验。在创建 Angular 应用程序时，我们应该考虑使用特性模块和懒加载来使应用程序更为高效和可维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6479c162968c7c53b05b7d80