Unpacking Bundling

on YouTube ↗51m

" summary

Eight concrete bundler moves: extract and inline only the CSS for components rendered on a page, move async data into separate dynamic-import chunks, rebundle route-specific chunks into one file to cut requests, and optionally bundle third‑party scripts at build time. Tooling includes a font pipeline called unifont, a plugin system that purges polyfills, and a scripts integration. Early results show 39% total JavaScript decrease and 66% unused JavaScript decrease on a test site; several features are experimental but already shipping.

AI-written summary · about

" chapters (14)

1. 0:00Introduction
2. 3:59Nu framework overview
3. 8:19Eight bundler strategies
4. 11:48Style inlining
5. 16:29Optimizing INP with prefetching
6. 20:47Font optimization at build
7. 24:43Removing unused async data
8. 27:33Third-party script bundling
9. 30:06Combining chunks
10. 34:20Replacing polyfills
11. 37:35Zero-JS pages
12. 38:59Nu accessibility modules
13. 41:09Open source contributions
14. 42:11Question and answer session

" related talks

• 27mUnpacking BundlingDaniel Roe · Vue.js Nation 2025
• 36mUnbundling the JavaScript module bundlerLuciano Mammino · Codemotion Rome 2018
• 45mBundler BonanzaJonathan Creamer · Connect.Tech 2024
• 34mBuild-time Optimizations in JavaScript ApplicationsEvan You · ReactiveConf 2017
• 19mMaking front end modules actually workLin Clark · EmpireNode 2015
• 42mLittle JavaScript Bundles of JoySophie Koonin · CityJS Conference 2020
• 33mNo-build: pipe dream, or near future?Lea verou · dotJS 2026
• 31mBreaking up with the bundleJoel Hawksley · RailsConf 2022