Back to the Catalog
web-performance
frontend
http
networking
browser

Read the Network Waterfall

29 questions

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

  1. Not answered. Reading one request bar from left to right, which lists its possible stages in the correct order?
  2. Not answered. One request has a long Stalled segment, another a long Waiting (TTFB) segment. What's the practical difference?
  3. 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?
  4. Not answered. A 12 KB JSON response has an unusually long Content download segment. What are the two most likely explanations?
  5. 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.)
  6. Not answered. TTFB is server processing time plus how many network round trip(s)?
  7. 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?
  8. Not answered. Looking at this waterfall, why doesn't icons.woff2 start downloading until after both index.html and app.css have finished?
  9. Not answered. script7.js and script8.js sit Stalled for a long time before anything else happens. What causes it?
  10. Not answered. The same eight scripts are requested again, this time over HTTP/2. What changed?
  11. 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?
  12. 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.)
  13. 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?
  14. 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?
  15. 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?
  16. Not answered. Comparing block and swap in this font-loading timeline, which statements are true? (Select all that apply.)
  17. 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?
  18. Not answered. What's the practical difference between preconnect and dns-prefetch?
  19. Not answered. When is adding preconnect actually worth it? (Select all that apply.)
  20. Not answered. Which resource hint fetches a resource at high priority without executing or applying it?
  21. Not answered. What is prefetch actually for, and at what priority does it run?
  22. Not answered. Why does a JavaScript module graph specifically benefit from modulepreload, more than a single preload tag would help?
  23. Not answered. An <img> tag has fetchpriority="high" set on it. What does that attribute actually change?
  24. Not answered. Which of these are genuine resource-hint own-goals? (Select all that apply.)
  25. Not answered. HTTP/2 multiplexes many requests over one connection. What does multiplexing NOT solve?
  26. Not answered. Where does head-of-line (HOL) blocking live in each of these? (Select all that apply.)
  27. 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?
  28. 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?
  29. Not answered. Which statements about an HTTP/2 waterfall, many requests over one connection, are true? (Select all that apply.)