The Need for Speed (aka Angular Performance).
summary
Metrics and concrete fixes dominate: use Webpack Bundle Analyzer, Perfume.js and Lighthouse to measure, enable AOT and tree shaking, lazy load modules, debounce input with debounceTime, move filtering to the parent (filter in parent), split input and list into components, adopt OnPush change detection, and stop painting the whole list by adding a cdk virtual scroll viewport. A real demo shows a list of 9999 items and the before/after speed gains.
AI-written summary · about
chapters (5)
- 0:00Start
- 2:19MEASURING PERFORMANCE
- 3:46WEBPACK-BUNDLE-ANALYZER
- 6:21BUILD TIME PERFORMANCE
- 9:58RUN TIME PERFORMANCE
related talks
01h 04mNeed for speed 8, performance tuning of your web application
31mAngular Performance: Your App at the Speed of Light
58mNeed for speed 8, performance tuning of your web application
37mSecret Shortcuts of Loading Web Performance
31mThe Future of Front-End Performance
19mAngular Performance Patterns
32mProfiling Bootstrap Performance of Angular Apps
43mAngular Performance Workshop