Response Time

Doherty Threshold

Why 400ms is the magic number

Key Insight

Productivity soars when a computer and its users interact at a pace (<400ms) that ensures neither has to wait on the other.

Key Points

  • •Productivity soars when computer and user interact at a pace (<400ms) that ensures neither waits on the other
  • •System responses under 400ms keep users in a state of flow
  • •<100ms feels instantaneous—user perceives no delay at all
  • •100–200ms feels connected—user notices but stays engaged
  • •200–1000ms feels like the system is working—acceptable with visual feedback
  • •1–10 seconds requires a progress indicator to maintain trust
  • •>10 seconds causes task abandonment—users lose context and leave
  • •Average page weight keeps increasing each year, making performance optimization critical
  • •[FIGURE 10-1 — Page weight trends] Shows: Graph showing average page weight increasing year over year. Teaches: Web pages are getting heavier, making performance optimization increasingly important. Reproduce as: Line chart of page weight over time. Data: HTTP Archive, 2023.
  • •[FIGURE 10-2 — Instagram skeleton screen] Shows: Instagram feed loading with gray placeholder boxes matching content layout. Teaches: Skeleton screens give immediate visual feedback, making load times feel shorter. Reproduce as: Side-by-side skeleton vs loaded state.
  • •[FIGURE 10-3 — Unsplash blur-up] Shows: Unsplash image loading from tiny blurred preview to full resolution. Teaches: "Blur up" technique shows low-res preview instantly, then sharpens—perceived instant load. Reproduce as: Progressive image loading animation.
  • •[FIGURE 10-4 — Gmail loading animation] Shows: Gmail colored dots animation during loading. Teaches: Distinctive, branded loading animations make wait times feel shorter through engagement. Reproduce as: Loading animation with timing annotations.
  • •[FIGURE 10-5 — Apple progress bar] Shows: macOS software update with progress bar and estimated time remaining. Teaches: Progress bars with time estimates help users decide whether to wait or multitask. Reproduce as: Progress indicator with percentage and ETA.
  • •[FIGURE 10-6 — Instagram optimistic UI] Shows: Instagram comment appearing immediately before server confirmation. Teaches: Optimistic UI displays results before server response, making interactions feel instant. Reproduce as: Comment posting flow showing optimistic state.
  • •[FIGURE 10-7 — Google Privacy Checkup] Shows: Google Privacy Checkup wizard with step progress indicator. Teaches: Multi-step processes need progress indicators so users understand scope and position. Reproduce as: Step wizard with progress visualization.

Guidelines

  • ✓Optimize critical interactions (clicks, typing, navigation) to respond under 400ms
  • ✓Use skeleton screens or optimistic UI to mask unavoidable delays
  • ✓Show progress indicators for any operation exceeding 1 second
  • ✓Preload likely next actions to create perceived instant response
  • ✓Animate transitions at 200–300ms to feel responsive without rushing
  • ✓Measure and monitor real-user response times, not just server times

Want to learn this interactively?

Experience hands-on experiments and test your understanding.

Start Learning
🔥

Practice this topic

Active recall — strengthens long-term retention

Related Topics