Waterfall chart

Drill down to the Waterfall page from the Waterfall summary page.

You can also open the waterfall chart directly from the interactive chart, and through the Raw Scatter and Raw Data drilldowns from the interactive chart. When you drill down from the interactive chart, the Waterfall page opens in a new browser tab. You must enable popups for portal.dynatrace.com to allow the new tab to open.

For the selected test step, the waterfall chart lists every downloaded object in the order requested, and displays a timeline for each object that charts the metrics collected for the object.

In the Waterfall page, data is available for all test executions within the same hour as the selected execution, even if you drilled down from a chart with a time frame longer than 1 hour. For example, from a test that ran at 11:40, you can go back or forward to other test executions (if any) between 11:00 and 12:00.

Header details

The page header provides summary information about the step:

  1. The step number, test name, and step name.
  2. The header properties and metadata from the HAR file.
  3. The timestamp — the actual start date and time for the charted step. The time is based on the timezone configured for your account, which may differ from your local time.
  4. The testing location for this test execution.
  5. User experience metrics for the step. These factors affect the user's perception of the page's performance. See Waterfall metrics below for definitions.
  6. A thumbnail of the screenshot for the step (page), if available.

Properties and metadata

If the Properties and metadata information is hidden, click the expand icon to display it.

The information in this section depends on the test type:

  • Backbone
  • Last Mile
  • Private Last Mile
  • Mobile

Chart details

Each resource downloaded for the step is listed in the waterfall in the order it was requested. Only the final part of an object's URL is displayed; hover over the URL to view the full URL in a tooltip.

Object statistics are displayed above the waterfall:

  • CSS files – The number of CSS files downloaded
  • JS files – The number of JavaScript files downloaded
  • Images – The number of image files (e.g. JPG or PNG) downloaded

Timeline

The timeline represents the overall download time for the object. The colors in the bar identify the metrics that are reported in the timeline.

Hover over a timeline to display a tooltip with the following information:

  • The value for each metric collected, and the color that identifies the metric.
  • Network Time
  • User Experience Time
  • Type – The object type: Text/HTML, CSS, application/JavaScript, or image.
  • IP Address – The IP address from which the object was downloaded.
  • Number of Bytes – The total bytes downloaded.
  • Return Code – The object's return code, with a brief definition.

If the step failed, the timestamp is red and the error is listed in red above the waterfall.

If an object error occurred, it is identified by a red Status code and a red line through the timeline. Hover over the status code to display a brief description of the error.

Columns

These columns can be included in the chart. See Filtering the waterfall chart below for details of selecting which columns to display.

  • ID – The number assigned to the object to indicate the order in which it was downloaded.
  • URL – The object's URL. Only the final part of the URL (e.g. the file name for a downloaded image or stylesheet) is displayed; hover over the URL to view the full URL in a tooltip.
  • Service – Whether an object is first-party or third-party content.
  • Category – The category of 3rd-party hosts. For 1st-party objects, this column contains a dash to indicate there is no category.
  • Owner – For third-party objects, the vendor/owner, e.g., Google, Akamai, or Facebook.
  • Domain – The domain that the resource was served from.
  • Content type – Text, CSS, JavaScript, image, or other content type. You can filter or highlight certain content types, as described below.
  • PurePath – This column appears when PurePath integration with Dynatrace AppMon is enabled for your username. It displays icons for drilling down to PurePaths in the AppMon Client.
  • Status – The HTTP status code. Hover over the code to see a short description.
  • Protocol – HTTP or HTTPS.
  • Size – The object's size in bytes (B) or kilobytes (KB).
  • IP Address – The IP address from which the object was downloaded.
  • Offset – The time elapsed from the start of page navigation to the object request.
  • Metric values – DNS lookup, initial Connection, SSL, Request time, First byte download, Content download.
  • Client time – The total download time minus any time spent in network interaction. This is a measure of the idle or management time for the browser when downloading a resource. It is the measure of the gaps between, for example, the end of a Domain Lookup End and a Connect Start; or between the End Connection time and the First Byte Time.
  • Total time – The total download time including client time and network time.
  • Timeline – A graphical representation of the metrics collected for object downloads from the start of page navigation through page complete.

Screen captures

If screen captures are available for the test execution, a thumbnail of the first screenshot captured is displayed above the waterfall. Click the thumbnail to view a larger image in a popup window.

To get more information from the screen captures, click View screen capture to display the Screen capture page.

The View screen capture button only appears if screen captures are available.

Object trend chart

Click an object in the waterfall to display a trend chart of performance (response time) and availability for the time period covered by the waterfall. The chart shows you the object's performance in context to identify any trends or outlier values.

Hover over a data point or bar to view the timestamp and the metric value.

Click Performance or Availability in the legend to hide/show that metric in the chart.

To zoom in on a time frame in the chart, click-and-drag on the chart from the beginning of the time frame to the end. The chart zooms when you release the mouse button. To go back to the original resolution, click Reset zoom.

Drill down from this chart as described below.

Save the object trend chart

You can save an object trend chart by printing or downloading an image. Click the menu at the top right corner of the object chart to display the options:

  • Print chart
  • Download PNG image
  • Download JPEG image
  • Download SVG vector image

Drilling down from the waterfall

Drill down to the PurePath

When PurePath integration with Dynatrace AppMon is enabled for your username, the PurePath column of the waterfall chart displays an icon . Click the icon to drill down to the PurePath in the AppMon Client.

Run diagnostics

This feature is not available for Mobile tests.

  1. Display the object trend chart as described above.
  2. Click Run diagnostics to run an analysis of the test.

The Diagnostics page displays results for Trace route, Ping, and Dig tests, in separate tabs:

  • Trace route records the route that a packet of data travels between hosts. Trace route can help identify which node on the network may be causing slowness along a given route. A trace route test enables you to see the path, or hops, that the test took, including the IP address, host name, and response time in seconds.
  • Ping measures the time it takes for a host at a given IP address to receive and respond to a request. Ping is often used to see if a specific host is available on a network.
  • Dig tests DNS queries sent to the DNS servers and returns the results of the query. This information can help you to troubleshoot DNS problems and to debug name server configuration issues.

View the object

  1. Display the object trend chart as described above. The URL for the object is listed below the chart.
  2. Click Open Link to display the object in a new browser tab.
    For example, if the object is a JavaScript (.js ) file, the file text is displayed.

Filtering the waterfall

Use the controls above the waterfall chart to select the information you want to see in the chart.

Filter field

Type a string in the Filter for objects and header content field to see only the objects that contain the filter string in their URL. The string can be anywhere in the URL. This field filters the chart based on the full URL, not just on the object name displays in the URL column.

Presets

The Presets options automatically select which columns to display:

  • Default layout – Include these columns in the waterfall:

    • ID
    • URL
    • Domain
    • PurePath
    • Status
    • Size
    • Timeline
  • Simple layout – Display all the default columns except for Domain and Size.

  • Advanced layout – Display the object data in a table that includes all columns except the timeline.

Columns

Select or clear items on the Columns menu to choose the information (columns) to display in the waterfall. The ID and URL columns are displayed by default and can't be removed.

Browser events

When you select a W3C metric in the ​Browser events​ menu, the metric's value is charted with a vertical line color-coded to identify the metric.

For Backbone tests that run on the Chrome 56 Agent, the Browser events include Visually complete.

Resources

Use the Resources menu to select which object types to include in the waterfall. If no object types are selected in this menu, all types are included.

Highlight

Select object types in the Highlight menu to quickly find objects in the waterfall. Selected types are highlighted with the color indicated in the menu.

Show errors only

To focus on the objects that have errors, click the Show errors only switch to "on" to filter out all objects that do not have errors.

Managing the waterfall

To manage the data display and share the data, you can:

  1. Go to another test execution – Click the previous and next icons for the timestamp to move through the waterfalls for the test executions.
  2. Go to other steps – If a test has multiple steps, use Previous step and Next step at the top of the page to view the waterfalls for other steps.
  3. View screen captures, as described above.
  4. Share the waterfall – Click Post graph to copy the URL to share this Waterfall page.
    A waterfall shared through ​Post graph​ shows the account time, which may differ from the local time.
  5. Display the waterfall in a new browser tab – Click Tear Off. The waterfall also remains in the original browser tab. The waterfall copy uses the account timezone.
  6. Export waterfall data as a HAR file – Click Download data.
  7. Export waterfall data as a CSV file – Click Download CSV. The CSV file includes W3C data.
  8. Sort the waterfall – Click a column head to sort the waterfall by that column. The column used to sort the chart is boldface.
    By default, the waterfall is sorted in the order the objects were downloaded; the object IDs in the first column indicate the download order, however the chart is sorted.

Waterfall metrics

These metrics may be displayed in the waterfall page, either in the header or in the object timeline depending on the columns selected to display.

  • Client time – Total time to download the resource (object) minus the network time for the resource: the sum of the gaps when downloading resources on a page, when no network activity is happening. This is page-level client time. Unlike the test-level client time, this metric is not dependent on the Include non-network(client time) in results test setting.
  • Connections – The number of TCP/IP connections opened. This value is equal to the number of resources with Initial Connection times in the waterfall chart.
  • Content download – The time spent downloading the total content of the object. If the content is downloaded entirely in the first packet received and no additional packets are downloaded, this metric is not reported.
  • DNS lookup  – The time required to resolve the IP address of the host. This time appears only if the address was resolved.
  • Elements – The total number of elements (objects) downloaded. This value matches the number of rows in the waterfall chart.
  • First byte download – The time between the end of the request and the arrival of the first packet of the response (all resources report this component).
  • Initial connection – The time to open a TCP/IP connection. This metric is charted only if a TCP/IP connection is established. If the connection is reused for another resource, this metric does not appear in that resource's timeline.
  • IP addresses – The number of IP addresses to which connections were made. This value may beequal to or less than the number of connections, because multiple connections can be made to the same IP address.
  • Network time – The total time of all network traffic for a page (not the sum of download times for all the resources), from the base page's DNS lookup and end through delivery of the last packet of the last resource, excluding any client processing time. In the waterfall chart, the network time reported for an object is based on the whole step (page), not the object.
  • Request time – The time from an HTTP request is sent to the server until the time the first byte of the response is received.
  • Size – The total number of bytes downloaded from the web server.
  • Speed index – The average time in which visible parts of the page are displayed, based on the average of Visually complete. A lower speed index means that most parts of the page are rendered very quickly. This metric is only available for Backbone tests that run on the Chrome 56 Agent.
  • SSL – The time to establish an SSL connection.
  • Start offset – The time elapsed from the start of the page load to when this object began downloading. To indicate the start offset, the timeline is indented from the left edge of the waterfall chart.
  • Total time – Total download time, including any client time.
  • UX time – User experience time. The perceived load time of the page. This is the time it takes for the page to appear loaded to the user although the browser may still be downloading items in the background. It is the total time for the step, from the DNS lookup for the first object downloaded to the last byte downloaded for the last object, including any client processing time. UX time may be equal to or greater than network time if it includes times when there is no network activity. When Include client (non-network) time in results is disabled in the test settings, UX Time is reported as zero. In the waterfall chart, the UX time reported for an object is based on the whole step (page), not the object.
  • Visually complete – The total time to render all the content in the browser's visible area, i.e. all the web page content that's visible without scrolling; content "below the fold" and non-visible content does not affect the metric. This metric is only available for Backbone tests that run on the Chrome 56 Agent. It is displayed as a browser event in the waterfall chart.