Tuning Your Angular Application

on YouTube ↗19m

" summary

Three concrete wins: find a memory leak with Chrome DevTools — memory heap showed three instances — and fix lingering subscriptions by using async pipe and SubSink (HTTP client auto-completes some streams). Shrink bundles with webpack-bundle-analyzer, Angular CLI budgets, the Import Cost VS Code extension and BundlePhobia; swapping full lodash for tree-shakable imports cuts size. Structure code to avoid cross‑feature imports — “don’t share with your siblings” — and prefer smart parents with dumb presentation children.

AI-written summary · about

" chapters (8)

1. 0:00Start
2. 3:29Using Async pipe
3. 4:07Using subsink from Ward Bell
4. 5:31Webpack bundle analyzer
5. 5:47Use ES modules version of libraries
6. 6:34Angular CLI Budgets
7. 6:53Import cost for VScode
8. 7:16Bundle Phobia

" related talks

• 44mRockin’ in the Angular WorldWassim Chegham, Vincent Ogloblinsky · DevFest Toulouse 2019
• 22mThe dark side of tuning Angular performanceDmitriy Shekhovtsov · ngAtlanta Conf 2018
• 40mOptimized Angular Apps: Smaller, Faster, BetterMaxim Salnikov · iJS 2018
• 09mCommon Angular GotchasYew Hong Tat · NG-MY 2019
• 20mTools for Fast Angular ApplicationsMinko Gechev · ng-conf 2019
• 31mOptimized Angular apps: smaller, faster, betterMaxim Salnikov · Amsterdam JSNation Conference 2018
• 17mRethinking Angular Architecture & PerformanceMark Pieszak · NG Poland 2020
• 28mDebugging the Performance of 4,860 Angular AppsStephen Fluin · ngVikings 2020