Introduction
The waterfall lists all HTTPS requests that have been required to load the page including assets (images, javascript files etc) third-party requests and web service calls.
The waterfall contains temporal information, as well as the establishment of network connections on the transfer of data. You can find useful information for a good understanding of the loading of the page. E.g. The weight of the various resources, the HTTP statuses or the HTTP headers sent on each request and response.
Speed Analysis Lab includes an interactive waterfall in the analysis reports, comparison reports, and also the detailed steps reports of the User Scenario feature.
Report breakdown
Timings
The timings section lists the values of all performance metrics for the page. Select the metrics you want to display on the waterfall (as vertical lines), so you can analyze them with the related network traffic.
Select LCP to see the related request if the LCP is triggered by an image.
Long tasks
Long Tasks (web browser being busy for more than 50ms) and the Total Blocking Time value. The Long Task(s) related to the Max Potential FID are highlighted in a different color.
Waterfall
The waterfall displays the sequential list of all HTTP requests.
By default, the report will show:
- The HTTP method (in most cases GET or POST).
- The URL (hover over the name to see the full URL)
- The HTTP Status (200, 301, 404, etc.)
- The response size
- Its placement on a time axis, with a breakdown of the different steps between establishing the connection and receiving the response
Waterfall detailed values
Hover over the request representation to obtain detailed values on the request and response time milestones.
- DNS Lookup: the time required for DNS resolution.
- Connecting: the time needed to establish the TCP (and possibly SSL) connection required for HTTP communication.
- Waiting: the time between the HTTP request being sent and the start of the response being received.
- Receiving: the time between the beginning and the end of receiving the response.
In order to realistically reproduce the context of an Internet user, Speed Analysis Lab injects latency on all these steps, with the exception of the DNS Lookup. All observed delays are therefore dependent on the nature of the connection configured for your tests. This is especially true for the Connecting step, which will suffer latency on both the TCP connection and on the SSL connection (if applicable).
Please note that the DNS Lookup and Connecting steps will not always be present. DNS resolution is required only once per domain, and TCP (and SSL if applicable) connection will only be required if an existing TCP connection is not used.
Click anywhere on the line to see more information on a given request/response.
You can find the full URL of the request, the related IP address, the HTTP headers of the request and finally of the response.
Filters and customization
Click 'Customize columns' to customize your display settings.
Column name | Description |
Method | The HTTP method used by the request (GET, POST, PUT, etc) |
URL | The name of the resource - The full URL is displayed when hovering over the name. |
Domain | The domain you are sending the request to (e.g. example.com). |
Status | The status of the HTTP response (200, 301, 404, etc.), of the cache ("from cache") or the error on the request (e.g. "Request blocked by the browser" if you use our AdBlock or Blocklist / Allowlist features). |
Type | The type of content associated with the request (Stylesheet, Image, XHR, etc). |
Size | Reponse size (as transferred over the network, will be the compressed size of the resource if it is compressed). Hover the value to get some details. |
Protocol | The protocol (http/1.1, h2, etc.) |
Scheme | The URL scheme (http,https, wss, etc) |
Remote Address | The IP address of the server (obtained after domain DNS resolution by Google DNS 8.8.8.8) |
Initiator | The resource and related source code line initially triggering the request (example: analytics.js: 28). Any associated call stack will be available when hovering over the Initiator value. |
Time | The total time between sending the request and retrieving the complete response. |
Priority | The priority given to the request by the web browser. |
Timings | The chronological breakdown of the various stages of the request/response communication. |
Use the URL filter to display only the requests containing the chosen text in the full URL
You can also filter the requests according to their types (Script, XHR etc).
These 2 types of filters can be used independently as well as in combination. The area at the bottom left of the waterfall will show you the number and weight of the filtered elements compared to the total of the requests.
You can click on any column name to sort the waterfall elements according to the value of this information. A first click will apply an ascending sort. Click a second time to obtain a descending sort.
Tip: A good approach to study your third-party content (external dependencies) is to display the Domain and Initiator columns and then use the sorting features on those columns.
Dependency map
The dependency map helps you understand dependencies between HTTP requests on a web page.
Use the dependency map to analyze which third party is responsible for which requests, whether a third party is loading more data than expected or whether there is some unknown third party at play.
- The heavier the weight of the response, the larger the size of the node.
- The node color changes each time the domain changes.