Latency budgets for interfaces that feel instant

We hold four budgets: 16ms for anything attached to a pointer, 100ms for a state change, 300ms for a navigation, and 1s for work that had to leave the machine. Past 1s, we show progress rather than a spinner, because a spinner is an apology and progress is information.

What we trade

Holding these budgets costs us features. Server-side personalisation on first paint, heavy client-side routing, and most third-party scripts are simply excluded. The budget is the constraint the design works inside, not a target we optimise toward afterwards.

// The rule we actually apply in review:
// if an interaction cannot meet its budget, the interaction changes —
// not the budget.
const BUDGETS_MS = {
  pointerBound: 16,
  stateChange: 100,
  navigation: 300,
  network: 1000,
} as const;