JavaScript Cost
Last updated:
Every kilobyte costs download, parse, execution, and battery — question SPA weight and hydrate only what you must.
01 — Purpose
JavaScript has real cost
Users pay for every script through download, parse, execution, and battery — most slowness is self-inflicted bundle and hydration weight, not slow networks alone.
JavaScript is the only asset that blocks the main thread by default. Users care about speed and clarity — not architectural spectacle. Many sites deliver content, forms, and light interaction without SPA complexity.
See JavaScript standard and principles — performance is product quality.
02 — Principles
Every kilobyte should earn its place
The fastest JavaScript is the JavaScript never shipped.
- progressive enhancement — baseline works without script
- ship behaviour per page or feature — not one global bundle for everything
- prefer platform APIs and native HTML before libraries
03 — Practice
Keep cost under control
Split, lazy-load, audit dependencies, and hydrate selectively.
- code splitting and dynamic
import()for routes and heavy widgets - tree-shake and measure production bundles — not dev server guesses
- per-page script modules — see JS module architecture
- selective hydration — see hydration and client interactivity
04 — Avoid
Common bloat
Oversized bundles and unnecessary hydration are predictable — and preventable.
- importing entire libraries for three functions
- client rendering content that could be static HTML
- third-party scripts and framework layering nobody questions
05 — Close
Measure on real hardware
Mid-range phones on 4G expose bloat that developer laptops hide.
Set JavaScript budgets per template. Block merges that exceed them without explicit approval.
See Core Web Vitals, third-party performance, and performance review checklist.