I have an existing Angular app which eager-loads everything, and I would now like to add lazy-loading capabilities to it. Lazy-loading routes works fine, especially by following the guidelines provided by https://link.medium.com/xJ18mitCElb and https://link.medium.com/8F3G2rg0slb, with the following routes construct in AppRoutingModule: {path: 'dashboard', loadChildren: () => import('./dashboard/dashboard.module').then(m => m.DashboardModule)} Programmatically loading components is also doable from the TypeScript code, by using a component factory, such as in https://medium.com/angular-in-depth/lazy-load-components-in-angular-596357ab05d8 However my application has multiple components which template embeds other components like: component-a.html: <h1>Title</h1> <app-component-b></app-component-b> <app-component-c></app-component-c> Is it possible to have app-component-b and app-component-c lazy-loaded without changing significantly the existing html code of component-a? (So far, as they are not accessed via a route, lazy loading just does not happen). Many thanks for any help and guidance! Continue reading...
