Checkpoint: Performance Diagnosis
Prove the measurement mindset: classify costs by pipeline phase, read a waterfall, and pick fixes that match bottlenecks.
This checkpoint grades performance reasoning in runnable form — matching costs to pipeline phases, computing budgets, and choosing the right fix for the right symptom, exactly as you'll do against a real page.
Measure, name, then fix
Performance work fails when it starts with fixes. This checkpoint forces the professional order: measure, name the bottleneck (parse? layout? waterfall?), fix that one thing, and measure again. Keep the habit and you will spend your optimization hours where they pay; skip it and you will ship hero-image conversions nobody needed.
Budgets make performance a team value
A performance budget is a promise written down: "initial JS under 170KB, LCP under 2.5s on mid-range Android." Without one, every feature meeting ends with performance losing to shipping. With one, the conversation changes from opinion to measurement — and the checkpoint asks you to practice exactly that framing.
The diagnose-first order matters because the pipeline is a chain: optimizing an image when the bottleneck is a render-blocking script is rearranging deck chairs. Name the stage first. Then fix one thing. Then measure again, because the bottleneck has usually moved.