Bundle Size Budget Calculator
Enter your total transfer budget, framework overhead, and third-party scripts — get the remaining app code budget instantly with CWV benchmarks.
Use the Bundle Size Budget Calculator
Total JS Transfer Budget
Google recommends <300 KB for mobile. Target <150 KB for fast LCP.
Framework Baseline
Third-Party Libraries
Quick add:
No third-party libraries added.
Budget Breakdown
Core Web Vitals JS Benchmarks
Transfer sizes are gzipped. Your app code budget is compared against each threshold.
What fits in your app budget?
Calculate to see estimates.
Summary
Bundle size directly impacts Core Web Vitals scores, particularly LCP and TTI. This calculator helps you set a realistic per-page JavaScript transfer budget by subtracting known fixed costs — framework runtime, polyfills, analytics, and other third-party scripts — from your total size target. What remains is the budget available for your actual application code. Use the built-in CWV benchmarks to see where your budget lands against Google's recommended thresholds.
How it works
- Enter your total JavaScript transfer size budget in kilobytes.
- Input your framework baseline size (e.g. React + ReactDOM ~45 KB gzipped).
- Add sizes for each third-party library you load on the page.
- The calculator subtracts all fixed costs from your total budget.
- The remaining budget is what you have for application-specific code.
- Compare your budget against Core Web Vitals transfer-size benchmarks.
Use cases
- Setting performance budgets before starting a new project.
- Auditing an existing app to see how much room is left for new features.
- Comparing React vs. Preact vs. Solid framework cost tradeoffs.
- Justifying removal of a heavy library to stakeholders.
- Planning a performance sprint to hit a target Lighthouse score.
- Evaluating third-party script impact before adding analytics or chat widgets.