本文共计1290个文字，预计阅读时间需要6分钟。

URL请求映射到具体代码的一种机制，在网站模块划分、信息架构中扮演了重要角色。Angular的路由能力非常强大，让我们一起看看吧。【相关教程推荐：《Angular教程》】

路由是将URL请求映射到具体代码的一种机制，在网站的模块划分、信息架构中扮演了重要的角色，而Angular的路由能力非常强大，我们一起来看看吧。

路由懒加载

Angular可以根据路由，动态加载相应的模块代码，这个功能是性能优化的利器。

为了加快首页的渲染速度，我们可以设计如下的路由，让首页尽量保持简洁、清爽：

const routes: Routes = [ { path: '', children: [ { path: 'list', loadChildren: () => import('./components/list/list.module').then(m => m.ListModule), }, { path: 'detail', loadChildren: () => import('./components/detail/detail.module').then(m => m.DetailModule), }, ... ], }, ];

首页只有一些简单的静态元素，而其他页面，比如列表、详情、配置等模块都用loadChildren动态加载。