Lightning talk from Andrey Sitnik

on YouTube ↗06m

" summary

JavaScript libraries often hide big transitive costs: polyfills and unexpected dependencies inflate bundles by tens or hundreds of kilobytes. Measure the real cost by building a minimal webpack project, requiring the library, and taking the delta. Use size-limit as a guard, run CI checks and fail PRs that add bloat, and use the --why flag to invoke bundle analysis. Practical results include a ~25% reduction in shipped JS.

AI-written summary · about

" chapters (9)

1. 0:00Start
2. 1:40The rule of optimization
3. 2:03Bundle size?
4. 2:16Small example
5. 2:47Bundle size vs. the real cost
6. 3:26Main reason of heavy bundle
7. 4:03Size Limit calculates library size
8. 4:27Size Limit prevents regressions
9. 5:07Size Limit reduced...

" related talks

• 58m10KB or Bust: The Delicate Power of Webpack and BabelBrian Holt · Voxxed Days Bucharest 2018
• 26mWeb Performance in modern JavaScript worldFilip Rakowski · JavaScript fwdays'19
• 41mHow we make Web Apps lightning fast at Microsoft!Sean Thomas Larkin · Uphill Conf 2019
• 52m10KB or Bust: The Delicate Power of Webpack and BabelBrian Holt · jsDay 2018
• 31m10KB or Bust" The Delicate Power of Webpack and Babel"Brian Holt · JSConfCO 2018
• 27mDrawing the line between 3rd party and handcrafted codeGlenn Reyes · Agent Conf 2020
• 24mDrawing the line between 3rd party and custom codeGlenn Reyes · WebCamp Zagreb 2019
• 40mBuilding a Platform: Webpack and the FutureSean Thomas Larkin · JSCamp 2018