When JavaScript Bytes

on YouTube ↗51m

" summary

JavaScript is byte‑for‑byte the costliest resource: median mobile sites send ~378 KB compressed (≈1.8 MB on‑device), Chrome data shows 1.7 MB AGC vs 1.8 MB median site to make the point. Compression gaps (67% gzip, 16% Brotli, 17% uncompressed), long‑task pain (mobile P90 ≈14 s, React P90 ≈28 s), and script‑streaming limits (start parsing ≈30 KB) drive concrete targets: keep entry bundles ~50–100 KB and total JS ≈100 KB. Use Webpack‑bundle‑analyzer, Bundlephobia/cli, import‑cost, PerformanceObserver (long tasks); one case drops a vendor bundle 2.6 MB → 898 KB (66% reduction) by swapping AWS SDK imports and externals.

AI-written summary · about

" chapters (9)

1. 0:00Margaret Hamilton
2. 5:47Network
3. 10:55Bratli
4. 14:21Device
5. 18:28Long Tasks
6. 24:14How much is too much
7. 26:14Test devices
8. 32:44Reduce bundle size
9. 46:29Questions

" related talks

• 37mThe Cost of JavaScriptAddy Osmani · #PerfMatters Conference 2019
• 58mResponsible JavaScriptJeremy Wagner · NDC Oslo 2019
• 32mResponsible JavascriptJeremy Wagner · NEJS Conf 2019
• 36mPerformance for the long haulBen Schwarz · NG-DE Conference 2019
• 23mDecoding Javascript: Loading PerformanceArvin Abedinlou · DevWorld 2026
• 31m10KB or Bust" The Delicate Power of Webpack and Babel"Brian Holt · JSConfCO 2018
• 52m10KB or Bust: The Delicate Power of Webpack and BabelBrian Holt · jsDay 2018
• 28mA Case StudyPunit Sethi · JSFoo Coimbatore 2019