← Lessons

quiz vs the machine

Gold1340

Frontend

The Time To First Byte

Understand the server and network delay before any pixels can appear, and how it caps every other metric.

4 min read · core · beat Gold to climb

The hidden head start

Time to first byte measures how long it takes from requesting a page to receiving the first byte of the response. Nothing visible can happen before this, so a slow first byte pushes back paint and interactivity for the entire page. A good value is often under eight hundred milliseconds.

  • It covers redirects, connection setup, and server thinking time.
  • It is mostly backend and network work, not rendering.
  • It sets a floor that no front end trick can undo.

What it is made of

The measurement is a chain of smaller steps, and any one can dominate.

  • Redirects add extra round trips before the real request.
  • Connection setup includes the lookup, handshake, and secure negotiation.
  • Server processing is database queries and template work.
  • Network latency is the distance the bytes travel.

How to shrink it

  • Cache responses at the edge so they skip slow origin work.
  • Remove unnecessary redirects.
  • Use a content delivery network to cut physical distance.
  • Speed up slow database queries on the server.

Key idea

Time to first byte is the server and network delay before rendering can begin, so cut redirects, cache at the edge, and shorten the distance to the user.

Check yourself

Answer to earn rating on the learn ladder.

1. What does time to first byte measure?

2. Why does a slow first byte hurt every other metric?

3. Which technique most directly reduces time to first byte?