HAR Waterfall
Render a HAR file as a waterfall with status filters and per-entry headers.
Overview
Drop in a HAR (HTTP Archive) file - the export format DevTools, Charles, and Fiddler all produce - and the viewer renders it as a horizontal waterfall chart. Status-code filters, per-entry headers, and timing breakdown (DNS, connect, TLS, send, wait, receive) are all one click away.
It's for web developers and performance engineers chasing slow page loads or debugging cross-origin behaviour. Reach for it when you've got a HAR file from a colleague or a production session and need to inspect it without firing up DevTools or paying for a SaaS analyser.
How it works
HAR is a JSON schema (HAR 1.2) maintained by the W3C Web Performance group. Each entry holds a request, response, timings object, and metadata about the page. The viewer normalises timestamps to milliseconds relative to the earliest entry, then draws each entry as a stacked bar coloured by phase: DNS lookup, TCP connect, SSL/TLS handshake, request send, server wait (TTFB), and response receive.
Headers come straight out of the entry's request.headers and response.headers arrays. Status codes are colour-coded - 2xx green, 3xx blue, 4xx orange, 5xx red - matching the visual conventions of DevTools and similar tools.
Examples
- Filter to only 4xx/5xx:
Pick "errors only" to focus on failed requests. - Inspect a single entry's headers:
Click any waterfall bar -> request/response headers panel opens. - A slow TTFB:
Long server wait phase (orange) on a request indicates the backend, not the network. - A long DNS phase:
Repeated DNS lookups for the same host suggest connection-pool misses or cold starts.
FAQ
Where do HAR files come from?
Browser DevTools (right-click in Network -> "Save all as HAR"), HTTP debugging proxies (Charles, Fiddler, mitmproxy), and load-testing tools all export HAR.
Does it show response bodies?
Response bodies are included in the HAR only if the capturing tool enabled body capture - DevTools doesn't by default. Headers and timings are always present.
Is the HAR uploaded?
Parsing happens in the browser - the file doesn't leave the page. Useful when the HAR contains sensitive cookies or auth headers.
How do I tell TTFB from total time?
Total time is the sum of all phases. TTFB is the "wait" phase - the time from sending the last byte of the request to receiving the first byte of the response.