Improving Start-up Performance with Lazy Loading in Angular 2
summary
A working Angular 2 example converts an eager app into lazy modules so webpack emits a separate chunk that loads on navigation, proving angular 2 router loader splits bundles and lazy loading actually reduces initial payload. A canLoad guard blocks module download until authentication, and a custom preloading strategy with a seven second delay plus support for preloadAllModules and a route data flag demonstrates staged prefetching. The shared service duplication bug is fixed with the forRoot shared module pattern and the demo restores the username suggestion so the solution works.
AI-written summary · about
chapters (9)
- 0:00Introduction
- 0:52Lazy Loading
- 3:53Demonstration
- 12:19offguard
- 16:13preloading
- 25:54Model Structure
- 28:06Model Extension
- 29:11Demo
- 31:39Summary
related talks
32mImproving Startup Performance with Lazy Loading in Angular
30mStep by Step Improving Startup Performance with Lazy Loading in Angular
17mBe lazy, but with strategy
29mAngular Router - Let's Get Lazy!
45mLazy Loading: Supercharge your Angular apps!
29mAdv Lazy Loading w/ Angular
30mDynamic and Lazy Loading: A Deep Dive
34mLazy-loading techniques beyond (Angular) router