Optimizing Angular Apps - Techniques for Performance Excellence
summary
Shows how switching routes to loadComponent or loadChildren plus preloading cuts the main bundle in half example build drops main chunk from 58KB to 26KB for a 50% bundle reduction, demonstrates using provideRouter with preloadAllModules and withPreloading, introduces NgOptimizedImage for image savings, replaces BehaviorSubject boilerplate with signals and computed signals to get fine‑grained DOM updates and no manual unsubscribes, recommends Chrome DevTools and App Signals for profiling and RUM.
AI-written summary · about
chapters (12)
- 0:00Angular performance intro
- 1:48Lazy loading for speed
- 5:00Preloading strategies
- 7:37Change detection explained
- 10:33OnPush for updates
- 12:39Angular signals improve reactivity
- 15:16Signals in component state
- 18:09Signals for derived UI
- 19:36Signals in services
- 22:02Signals performance impact
- 22:22Optimization recap
- 23:25Q&A
related talks
40mOptimized Angular Apps: Smaller, Faster, Better
45mOptimized Angular apps: smaller, faster, better
20mTools for Fast Angular Applications
17mRethinking Angular Architecture & Performance
31mOptimized Angular apps: smaller, faster, better
34mLazy-loading techniques beyond (Angular) router
40mNon-trivial optimization techniques in Angular
23mAngular optimization tips and tricks