Read the Network Waterfall
The network panel already knows why your page is slow. It just says so in a language most people never learned to read. This quiz teaches the bars: what each segment of a request means, which requests hold up the render, and which "optimization" only moved the problem two rows down.
Questions
- Not answered. Reading one request bar from left to right, which lists its possible stages in the correct order?
- Not answered. One request has a long Stalled segment, another a long Waiting (TTFB) segment. What's the practical difference?
- Not answered. style.css is a static file with no server-side logic, yet its Waiting (TTFB) segment is surprisingly long. What does that suggest?
- Not answered. A 12 KB JSON response has an unusually long Content download segment. What are the two most likely explanations?
- Not answered. A request's bar starts right at Waiting, with no Queued, DNS, Initial connection or TLS segments before it. Which of these explain that? (Select all that apply.)
- Not answered. TTFB is server processing time plus how many network round trip(s)?
- Not answered. How do a memory cache hit, a disk cache hit, and a 304 Not Modified response typically look different from each other in the waterfall?
- Not answered. Looking at this waterfall, why doesn't icons.woff2 start downloading until after both index.html and app.css have finished?
- Not answered. script7.js and script8.js sit Stalled for a long time before anything else happens. What causes it?
- Not answered. The same eight scripts are requested again, this time over HTTP/2. What changed?
- Not answered. hero.jpg is this page's LCP candidate, but its request starts long after index.html finished downloading. What is the most likely cause?
- Not answered. A page has one stylesheet, loaded with a plain
<link rel="stylesheet">in<head>and no other attributes. Which changes would remove it from the render-blocking path? (Select all that apply.) - Not answered. Three scripts load with different attributes. Which one pauses the HTML parser for both its download and its execution, blocking everything after it?
- Not answered. widget.js and app.js are roughly the same file size, yet widget.js's bar is much wider. What does the extra width represent?
- Not answered. This request ends in a 200, but three tiny bars come before it. What are those three bars, and what do they cost?
- Not answered. Comparing block and swap in this font-loading timeline, which statements are true? (Select all that apply.)
- Not answered. A page's waterfall finishes in under a second, every request completes quickly, and nothing looks stalled. The page still feels sluggish to interact with. What does the waterfall alone not show you?
- Not answered. What's the practical difference between preconnect and dns-prefetch?
- Not answered. When is adding preconnect actually worth it? (Select all that apply.)
- Not answered. Which resource hint fetches a resource at high priority without executing or applying it?
- Not answered. What is prefetch actually for, and at what priority does it run?
- Not answered. Why does a JavaScript module graph specifically benefit from modulepreload, more than a single preload tag would help?
- Not answered. An
<img>tag hasfetchpriority="high"set on it. What does that attribute actually change? - Not answered. Which of these are genuine resource-hint own-goals? (Select all that apply.)
- Not answered. HTTP/2 multiplexes many requests over one connection. What does multiplexing NOT solve?
- Not answered. Where does head-of-line (HOL) blocking live in each of these? (Select all that apply.)
- Not answered. Domain sharding, splitting assets across asset1.example.com, asset2.example.com and so on, used to help pages under HTTP/1.1. Why does it usually hurt under HTTP/2?
- Not answered. HTTP/2 Server Push let a server send resources before the browser asked for them. It's now deprecated and removed from most browsers. What replaced it?
- Not answered. Which statements about an HTTP/2 waterfall, many requests over one connection, are true? (Select all that apply.)