Critical Path & Delivery
The waterfall from HTML to first content: blocking resources, resource hints, HTTP caching, CDNs and content-hashed assets — the network half of how fast a page feels.
The set of resources that must arrive and be processed before the browser can paint meaningful content — a dependency graph, not a byte count.
Bars are not the point. The staircase is: a resource that could not start until another finished is a dependency your page structure created, and often one you can delete.
Three different mechanisms produce one symptom. CSS blocks painting, synchronous scripts block parsing, and scripts wait on pending stylesheets — and each has a different fix.
`preconnect`, `dns-prefetch`, `preload`, `modulepreload` and `prefetch` are five different jobs — and a hint that guesses wrong costs more than no hint at all.
What the browser does before it makes a request at all: freshness, `no-cache` versus `no-store`, validators, revalidation, and `immutable`.
Build output to an edge near the user: what the cache key is made of, why invalidation is a worse tool than versioning, and why edge caching is mostly about latency rather than bandwidth.
`app.a3f19c.js` is a caching strategy, not a naming convention: you never invalidate a URL, you stop referencing it — with consequences for code splitting and for tabs that have been open all week.