Step by Step Improving Startup Performance with Lazy Loading in Angular
summary
Claim: lazy loading cuts initial bundle size and improves startup time while ngtools/CLI plus webpack chunking actually produces distinct files (demo shows a 5.chunk.js loaded on demand). Preloading via preloadAllModules fetches lazy bundles shortly after the shell (demo timing ~2s), removing the runtime loading delay. Pitfall: lazy modules get separate DI scopes so a shared service duplicates; fixable by a core module or the forRoot pattern (demo switches to forRoot and the shared service state remains intact).
AI-written summary · about
chapters (10)
- 0:00Start
- 0:46Contents
- 1:41Module Structure
- 2:50Root Module with Lazy Loading
- 3:39Routes for Feature Module
- 3:58Build Configuration
- 7:34Activating Preloading
- 21:00Solution (for Libraries)
- 22:27Auth Module
- 28:02Summary
related talks
32mImproving Startup Performance with Lazy Loading in Angular
34mImproving Start-up Performance with Lazy Loading in Angular 2
29mAdv Lazy Loading w/ Angular
30mDynamic and Lazy Loading: A Deep Dive
34mLazy-loading techniques beyond (Angular) router
17mBe lazy, but with strategy
45mLazy Loading: Supercharge your Angular apps!
20mTools for Fast Angular Applications