Performance Matters

on YouTube ↗32m

" summary

Bundle size is the main driver of startup slowness—examples include a 15 MB app shrinking dramatically after extracting SVGs—and common fixes are concrete: set sourceMap and namedChunks true in angular.json, run source-map-explorer to see who contributes kilobytes, use bundle budgets (warning/error) to prevent backslide, prefer lazy loading with loadChildren dynamic imports, enable gzip compression (900 KB → ~240 KB over network), serve over HTTP/2 and consider differential serving or Angular Universal prerendering.

AI-written summary · about

" chapters (21)

1. 0:00Start
2. 1:13Values
3. 4:30Web Vitals
4. 9:45Bundle Budgets
5. 10:43Stay Up To Date 10.0.0 (2020-06-24)
6. 13:05Be careful what you import
7. 14:32Bundle Size Demo
8. 22:46Maximize the code run
9. 24:12Content Compression
10. 25:36HTTP2
11. 26:37Throughput
12. 27:16Extra Round Trip
13. 27:503. Server Push with Firebase
14. 28:08Differential Serving & Loading
15. 28:33Differential Loading
16. 28:53Angular Universal
17. 29:23Consider SSR / Prerendering
18. 29:51Universal Today
19. 30:36Universal Options
20. 30:55More Lazy Loading!
21. 31:26Have fun!

" related talks

• 28mDebugging the Performance of 4,860 Angular AppsStephen Fluin · ngVikings 2020
• 16mBest PracticesStephen Fluin · ng-conf 2017
• 18mA Guide to Instant Loading Angular AppsMashhood Rastgar · JSHeroes 2018
• 20mTools for Fast Angular ApplicationsMinko Gechev · ng-conf 2019
• 40mOptimized Angular Apps: Smaller, Faster, BetterMaxim Salnikov · iJS 2018
• 22mBuilding Fast Angular Applications from EndMinko Gechev · JSNation 2019
• 17mRethinking Angular Architecture & PerformanceMark Pieszak · NG Poland 2020
• 31mOptimized Angular apps: smaller, faster, betterMaxim Salnikov · Amsterdam JSNation Conference 2018