Unpacking Bundling
summary
Nuxt expands bundling to the whole HTML: component CSS is inlined on server render, fonts are downloaded and metric‑adjusted with unifont and Fontaine, and third‑party scripts can be bundled into the app with n scripts. Pre-render payloads triggered INP regressions that are fixed by a tiny RAF+timeout (about 8ms delay). Async-data functions can be split into virtual chunks, reducing total JS by 39% less JS and 66% less unused JS on nuxt.com using Rollup rebundle techniques.
AI-written summary · about
chapters (11)
- 0:00Introduction
- 3:17Meta frameworks like Nuxt
- 7:11Bundler beyond JavaScript
- 11:25Interaction to Next Paint in Nuxt
- 15:43Nuxt Fonts and performance
- 18:17Experimental chunking for async data
- 20:25Nuxt Scripts and performance
- 21:28Rebundling static site chunks
- 23:16Cleaning JavaScript ecosystem with E8E
- 24:20Future Nuxt features
- 26:05Closing remarks
