The Page Took Two and a Half Seconds, and Four Hundred Milliseconds of That Was Your Code
Last timeThe Machines in Between
A slow load has four candidate phases and a waterfall tells you which one. Most of the time the answer is not the server, which is why guessing is expensive.
The four places time goes
Every request in this course has passed through the same four phases, in the
same order, and a slow load is slow because of one of them.
Finding the machine, which is the lookup from the first lesson. Opening the
conversation, which is the handshake and key agreement from the second.
Waiting, which is the time between the request leaving and the first byte of
the answer arriving, and which contains both travel and the work the server
did. Receiving, which is the transfer from the fourth lesson, limited by the
ramp as much as by the connection.
| fewer distinct origins h | being closer helps | a faster server helps | sending less helps | |
|---|---|---|---|---|
| finding the machine | 1 | 0 | 0 | 0 |
| opening the conversation | 0 | 1 | 0 | 0 |
| waiting for the first by | 0 | 1 | 1 | 0 |
| receiving the bytes | 0 | 0 | 1 | 1 |
That one ambiguity is worth dwelling on. The time to the first byte is one
number and it is the sum of two things: the request and the answer travelling,
which depends on distance, and the server producing the answer, which depends
on what it had to do. A browser cannot see the split. The server can: it knows
how long it spent, and the difference between that and the measured wait is
travel. Recording server time and sending it back is the single cheapest piece
of instrumentation available here.
Reading the picture
A waterfall draws one row per request, placed along a time axis, with each row
divided into the four phases. Its value is that the shapes are recognisable.
The lesson stops here
5 more paragraphs to go
You have read the opening. The rest of the argument, the problems that check whether it landed, and the lines worth keeping at the end all come with a plan.
The first lesson of every course in the library reads the whole way through, free, so you can see exactly what the rest of them are.
See the planThe contentsThis is the reading half
Starting the course gives you your own copy of it. Every idea on every page has problems standing under it, marked with a reason rather than a tick, and any sentence you do not believe can be opened and argued with. None of that can happen on a page nobody owns.
The contents