Every additional kilobyte you ship is a decision. You're deciding whose time, battery, and data plan you're willing to consume. For someone on a 3G connection in a rural area or a developing country, those bytes aren't just technical — they're ethical.
What Is a Performance Budget?
A performance budget is a hard limit on page weight, JavaScript execution time, and resource usage. Example budgets I use:
- Page weight: ≤ 1.2 MB (compressed)
- JavaScript: ≤ 250 KB (minified + gzipped)
- First Contentful Paint: ≤ 1.5 seconds
- Time to Interactive: ≤ 3 seconds on 4G
Why It’s Moral
When you exceed your budget:
- Users on slow networks wait longer
- Low-end devices drain battery faster
- People in data-capped regions pay more
- Accessibility suffers (slow pages = worse screen-reader experience)
“The web should be for everyone. Performance is accessibility.”
How I Enforce Budgets
- Bundle analysis with
webpack-bundle-analyzer - Performance budgets in Lighthouse CI
- Critical CSS extraction + defer non-critical JS
- Image optimization (AVIF/WebP + responsive sizes)
Performance isn't a feature. It's respect.