WEBVTT

1
00:00:01.200 --> 00:00:04.786
Type democompany.com and press Enter.

2
00:00:04.927 --> 00:00:06.736
Nothing has been sent yet.

3
00:00:06.947 --> 00:00:10.649
The browser's first job is to guess what you meant.

4
00:00:10.849 --> 00:00:14.493
The address bar is not a URL field.

5
00:00:14.518 --> 00:00:15.770
It's a guesser.

6
00:00:16.073 --> 00:00:19.508
Is this a hostname, or words to search for?

7
00:00:19.812 --> 00:00:25.731
A dot and a known ending say hostname, so it builds a URL.

8
00:00:25.931 --> 00:00:29.644
You left out the scheme, so the browser supplies one.

9
00:00:29.855 --> 00:00:33.928
Most browsers now try https first.

10
00:00:33.953 --> 00:00:41.788
It lowercases the host, encodes anything illegal, and only then has a real address to work with.

11
00:00:41.988 --> 00:00:48.012
Where it fails: guess wrong, and your words go to a search engine instead.

12
00:00:48.408 --> 00:00:52.458
Every later step depends on that guess.

13
00:00:53.159 --> 00:00:55.340
A hostname is for people.

14
00:00:55.469 --> 00:01:05.986
The network routes to numbers, so the browser must turn www.democompany.com into an IP address.

15
00:01:06.116 --> 00:01:10.224
That's DNS, the Domain Name System.

16
00:01:10.423 --> 00:01:17.468
First it checks what it already knows: its own cache, then the operating system's.

17
00:01:17.610 --> 00:01:21.033
A recent answer costs nothing.

18
00:01:21.233 --> 00:01:28.069
Otherwise, a resolver, usually your internet provider's, walks the tree from the right.

19
00:01:28.373 --> 00:01:32.052
A root server points to the servers for .com.

20
00:01:32.262 --> 00:01:38.066
They point to Demo Company's own name servers, which give the answer.

21
00:01:38.266 --> 00:01:45.985
Fun fact: the whole internet's naming starts at thirteen root server names, lettered A to M.

22
00:01:46.381 --> 00:01:53.473
Behind those thirteen names stand well over a thousand machines around the world.

23
00:01:53.673 --> 00:01:59.267
Every answer comes with a time to live, so the next lookup can be skipped.

24
00:01:59.478 --> 00:02:02.286
Where it fails: no such name.

25
00:02:02.589 --> 00:02:10.598
Chrome calls it DNS_PROBE_FINISHED_NXDOMAIN, and nothing further happens.

26
00:02:11.298 --> 00:02:18.738
With an address in hand, packets set off across the internet, router to router, network to network.

27
00:02:18.949 --> 00:02:21.072
Nobody plans the whole route.

28
00:02:21.213 --> 00:02:26.041
Each router just passes the packet one hop closer.

29
00:02:26.241 --> 00:02:33.507
Every step from here is counted in round trips: a message out and an answer back.

30
00:02:33.707 --> 00:02:37.722
A round trip has a floor no upgrade can lower.

31
00:02:37.933 --> 00:02:43.074
Light in fiber covers about two hundred kilometres each millisecond.

32
00:02:43.285 --> 00:02:49.657
A server across an ocean is many milliseconds away, every single trip.

33
00:02:49.857 --> 00:02:54.534
Where it fails: packets go out and nothing comes back.

34
00:02:54.838 --> 00:03:00.234
The browser waits, then gives up with ERR_CONNECTION_TIMED_OUT.

35
00:03:00.935 --> 00:03:05.891
Next, TCP opens a reliable channel, with a handshake.

36
00:03:05.916 --> 00:03:13.309
The browser says "let's talk", the server says "yes, let's", and the browser confirms.

37
00:03:13.509 --> 00:03:19.033
That costs one full round trip before a single byte of the page can move.

38
00:03:19.430 --> 00:03:27.137
TCP then numbers every piece, resends what's lost, and puts it all back in order.

39
00:03:27.337 --> 00:03:32.920
Where it fails: the machine is there, but nothing is listening on that port.

40
00:03:33.061 --> 00:03:38.365
The server refuses, and Chrome shows ERR_CONNECTION_REFUSED.

41
00:03:39.065 --> 00:03:48.003
Over that channel, TLS adds encryption, and something just as important: proof of who is answering.

42
00:03:48.203 --> 00:03:55.237
In TLS 1.3, browser and server agree on keys in one more round trip.

43
00:03:55.355 --> 00:03:57.688
The server sends its certificate.

44
00:03:57.688 --> 00:04:05.036
The browser checks that it names this host, hasn't expired, and was signed by an authority it trusts.

45
00:04:05.235 --> 00:04:08.356
That check is what the padlock means.

46
00:04:08.381 --> 00:04:15.845
It's the difference between talking to Demo Company and talking to someone pretending to be Demo Company.

47
00:04:16.045 --> 00:04:20.699
Where it fails: an expired or mismatched certificate.

48
00:04:20.910 --> 00:04:28.466
Chrome stops cold with "Your connection is not private", and most people sensibly turn back.

49
00:04:29.166 --> 00:04:36.571
Only now does the browser send the request: a method, a path, and the host it wants.

50
00:04:36.771 --> 00:04:39.753
Then it waits while the server works.

51
00:04:39.836 --> 00:04:46.545
The time until the first byte of the answer comes back has a name: time to first byte.

52
00:04:46.745 --> 00:04:50.435
And Demo Company's first answer isn't the page.

53
00:04:50.460 --> 00:04:59.119
It's a redirect: 307, try www.democompany.com instead.

54
00:04:59.319 --> 00:05:05.946
A redirect is a whole new request, sometimes with a new lookup and a new connection.

55
00:05:06.064 --> 00:05:12.727
Where it fails: redirects that point at each other, which Chrome stops with ERR_TOO_MANY_REDIRECTS.

56
00:05:12.729 --> 00:05:17.870
Or a server that answers with a 500 error, or very slowly.

57
00:05:18.570 --> 00:05:19.510
Add it up.

58
00:05:19.510 --> 00:05:25.743
A lookup, a handshake, a key exchange, and the request itself.

59
00:05:25.943 --> 00:05:32.303
On a cold start that's about four round trips before the first byte, more with a redirect.

60
00:05:32.328 --> 00:05:38.364
At a hundred milliseconds a trip, nearly half a second, and the page hasn't begun.

61
00:05:38.564 --> 00:05:41.616
That's why the web works so hard to skip trips.

62
00:05:41.687 --> 00:05:45.400
Browsers cache names and reuse open connections.

63
00:05:45.472 --> 00:05:52.993
HTTP/3, over QUIC, folds the TCP and TLS handshakes into one.

64
00:05:53.181 --> 00:05:58.090
Preconnect starts this work early, for a host you know you'll need.

65
00:05:58.290 --> 00:06:03.489
And it's why you should link to the final address, not one that redirects.

66
00:06:03.631 --> 00:06:07.460
Every hop you add, the reader pays for.

67
00:06:08.160 --> 00:06:13.986
Open the Network panel, load Demo Company, and select the first request.

68
00:06:14.278 --> 00:06:24.435
The Timing tab names every step: DNS lookup, initial connection, SSL, request sent, and waiting for the server.

69
00:06:24.636 --> 00:06:28.280
Reload, and most of those steps vanish.

70
00:06:28.363 --> 00:06:32.831
The name is cached and the connection is still open.

71
00:06:33.030 --> 00:06:35.815
All of that, before the first byte.

72
00:06:36.211 --> 00:06:44.661
Next: what the browser does once the bytes arrive, and why one URL becomes seventy requests.