Lazy Loading Web Applications
summary
Demonstrates how Angular actually lazy loads a component at runtime: a button triggers an async import that returns a component, then ViewContainerRef plus ComponentFactoryResolver injects it into the page; the StackBlitz demo loads and displays “I am a lazy component” so the approach works. Explains difference from route-based chunks, shows creating an inline NgModule to get CommonModule pipes, and mentions custom preload strategies and Angular 9+ support for lazy-loaded components.
AI-written summary · about
chapters (10)
- 0:00Start
- 0:05How Lazy Is Your Component
- 2:51Let's Talk About Lazy Loading
- 6:13Single Page Application Architecture
- 9:53The Problem?
- 11:59Angular Lazy Loading
- 12:44Uses Javascript import Syntax
- 13:16Allows for a custom strategy for lazy loading
- 17:56Angular Component Lazy Loading
- 26:05When To Use Lazy Loaded Components?
related talks
29mAdv Lazy Loading w/ Angular
30mDynamic and Lazy Loading: A Deep Dive
45mLazy Loading: Supercharge your Angular apps!
34mLazy-loading techniques beyond (Angular) router
32mImproving Startup Performance with Lazy Loading in Angular
34mImproving Start-up Performance with Lazy Loading in Angular 2
17mBe lazy, but with strategy
29mAngular Router - Let's Get Lazy!