Performance
Bundle budgets: free-recall review
Retrieval beats re-reading. For each prompt, say or write a full answer from memory before you open the model answer — the effort of recall is what makes the material stick.
Reconstruct the unit’s core mechanisms — the four-phase cost model, the splitting hierarchy, tree-shaking pitfalls, third-party mitigations, and the CI-plus-RUM enforcement loop — without looking back at the lessons.
- 01Name the four phases a JS bundle goes through before interactive, and say which are CPU-bound. Why does 'works on my laptop' fail?
- 02Give the 'Good' thresholds for LCP, INP, and CLS, and say which the bundle is a lever for.
- 03Explain route-level, component-level, and vendor splitting, and when each is the right choice.
- 04Why does importing one function from a CommonJS library ship the whole library, and what are the four pitfalls that defeat tree shaking?
- 05Why are third-party scripts the most common way to blow a bundle budget, and what are the three structural mitigations?
- 06Why is a bundle budget without a CI gate just an aspiration, and what is the full PR-merge-production enforcement stack? Include the anti-drift mechanism.
If you could reconstruct each answer from memory, you hold the unit’s spine: bytes are four CPU phases that hit mobile 4–8× harder than your laptop; LCP and INP move with shipped JS while CLS has its own causes; the reduction hierarchy is split, then shake, with compression a transport-only finisher; third-party scripts are the silent killer that needs its own budget and CSP; and none of it survives without a CI gate, RUM in production, and a ratcheting budget-raise protocol against drift.