A performance budget turns speed from an aspiration into a requirement with a number attached. Web performance almost never collapses in one bad release; it erodes one reasonable pull request at a time — a chart library here, a consent banner there, an image nobody compressed — until the product is slow and no single commit is to blame. A budget is the mechanism that makes each of those small costs visible at the moment it is introduced, when it is still cheap to refuse.
The concept is old — Steve Souders and the Chrome team were advocating it over a decade ago — but the enforcement tooling has matured to the point where there is no longer an excuse to run without one.
Budget Metrics Users Actually Feel
Anchor budgets to Google's Core Web Vitals, because they are field-measurable, well documented, and tied to search ranking: Largest Contentful Paint for loading, Interaction to Next Paint — which replaced First Input Delay in 2024 — for responsiveness, and Cumulative Layout Shift for visual stability. Add Time to First Byte as a backend early-warning signal.
Then add leading indicators you control directly. JavaScript bytes shipped is the best predictor of INP trouble on mid-range Android hardware, which is where a large share of real users live. A vitals budget tells you users are hurting; a bundle budget tells you before they are.
Three Kinds of Budget
- ▸Quantity budgets: hard ceilings on transferred bytes — total JavaScript per route, image weight, third-party script count. Crude, but enforceable on every PR in seconds and immune to lab noise.
- ▸Timing budgets: LCP and INP thresholds measured on a throttled, mid-range device profile, not a developer laptop. Google's published good thresholds — LCP within 2.5 seconds, INP under 200 milliseconds — are sensible defaults to tighten from.
- ▸Rule budgets: minimum Lighthouse category scores as a broad regression net when you want one number for a dashboard, with the caveat that composite scores hide which specific thing regressed.
Enforce in CI, Verify in the Field
Lab checks belong in the merge pipeline. Lighthouse CI runs audits against a preview deployment and fails the build on assertion violations; size-limit or bundlesize fails a PR that pushes a bundle past its ceiling and prints the delta right in the diff, which is exactly where a developer can act on it. Budgets that live in a wiki are opinions; budgets that fail builds are requirements.
But lab data is a simulation. Ground truth is real-user monitoring: the web-vitals library feeding your analytics, or the Chrome UX Report if you need a free external view. Field data covers the device and network distribution your lab profile only approximates, and it is what Google actually uses for ranking. The two disagree routinely — a heavy hydration cost can look fine in a lab run and terrible at the 75th percentile in the field — and the field wins every argument.
Budgets Are a Negotiation Instrument
The quiet superpower of a budget is organizational. When marketing wants a third tag manager or product wants a session-replay script, the conversation stops being engineers versus everyone and becomes portfolio management: the route has 40 kilobytes of headroom, the script costs 90, so what are we removing to afford it? Sometimes the answer is genuinely to spend — a feature can be worth its cost — but the trade is now explicit, priced, and decided by the people accountable for the product rather than discovered in a quarterly audit.
Getting started, in order:
1. Measure current reality with a month of field data; budgets set from a laptop lab run will be fiction. 2. Set budgets at today's numbers, not aspirational ones — the first goal is stopping regression, not heroics. 3. Wire quantity budgets into PR checks and timing budgets into Lighthouse CI against preview builds. 4. Ratchet down each quarter as optimizations land, so improvements become the new floor instead of headroom to squander. 5. Publish a route-level dashboard so ownership is visible and slow pages have names attached.
The commercial case does not need embellishment. Core Web Vitals are a documented ranking signal, so speed is an SEO position. Latency sits directly in the conversion path for any transactional product. And a disciplined bundle diet lowers bandwidth and compute bills as a side effect. A performance budget is a small amount of CI configuration that converts all of that from a hope into a property of the system — one that keeps holding during your busiest quarter, which is precisely when it matters most.