Posted by mark on June 8th, 2010
Detailed Timing Analysis of Embedded Page Elements now Visualised
Currently the WatchMouse website monitors (of type http and https) retrieve the HTML of a page and measure the resolve time, connect time, processing time and download time. Often this information is sufficient to detect slow page loads.
In some cases, however, it would be great to have a more detailed analysis containing all embedded elements (images, external stylesheets, …). This so-called “Full Page Monitoring” is available through the use of the WatchMouse scripting service.
Today WatchMouse introduces a new feature: Waterfall Analysis Diagrams for Full Page Monitors. The image below is an example of the results for a single Full Page Load check.

Love FireBug?
The loading of a page and its elements is visualized similar to the breakdowns you can get from tools like FireBug. And similar to FireBug you can generate a waterfall diagram for any webpage, allowing you to inspect slow loading elements, verify on server response headers, etc.
Next to that, the new Waterfall Analysis has two additional benefits:
- Continuous monitoring: your webpage is monitored every five minutes, with each check providing a full waterfall analysis, and each being available on demand through the dashboard.
- Worldwide monitoring: your webpage will be monitored from 48 different locations worldwide, providing interesting details on the pageload from each of these locations, not just from your current location.
Waterfall diagrams, all the time, any location
These two characteristics of the WatchMouse Waterfall Analysis (continuous monitoring and monitoring from many locations) can be very useful evaluating page load time in the following ways:
- Page load time changes over time. Peak traffic makes a web site possibly load slower, and site changes (like database modifications, or server architecture changes) can also have impact on the page load time. Page load trends can be followed in the standard performance reports in the WatchMouse console, while an in-depth analysis of a slow monitoring sequence can be performed using the waterfall analysis.
- Page load time depends on the location of the visitor. If your website’s target audience is international, you probably optimize the delivery of the page and page elements for all of your target countries by using a distributed cloud solution or a content delivery network (CDN). The Waterfall Analysis performed from many locations provides insight in which of the page elements are the bottleneck for a fast loading website.
Getting started
If you are a WatchMouse client already and you use our “scripting” monitors, there is nothing you have to do to dive into the Waterfall diagrams. Just open the log viewer and select the monitoring results for any of your scripting monitors: You will see the Waterfall Analysis icons show up. Clicking on the icon will lead you to the Waterfall diagram for that specific check.

If you are not using scripts yet, or if your scripts are not set-up as a “Full Page Load” monitor yet, simply follow these steps:
- Make sure you have one or more unused script monitors available in your subscription plan. You can always add additional scripting monitors to your subscription.
- Download the Full Pageload template and unzip it:
- Create a new monitor in the settings, and select type ‘script‘.
- Upload the Full Page script template (full_page.jmx) that you just downloaded.
- Switch to “expert mode” and fill in the host and path fields, e.g.: “www.yoursite.com” and “/index.html”
- Change any other settings to your taste and finally click ‘save’.
- Within a few seconds you should see the first monitor results and the waterfall via the log viewer.
Thats it!
How does it work? HAR!
The WatchMouse Waterfall Analysis diagrams are based on a number of open-source technologies which are integrated into the our monitoring infrastructure. The visualization of the waterfall itself is based on Jan Odvarko’s excellent HARviewer. As the name implies, the input format for the visualization is based on the Steve Souders‘ HTTP Archive format which is a generic “format that can be used by HTTP monitoring tools to export collected data”.
In short: Monitoring results from the WatchMouse Full Page Monitors are converted to HAR to be able to visualize it. Each waterfall diagram is also directly available for download as a standard HAR file, enabling you to use it in other tools too.
Keep an eye on the WatchMouse Labs blog for an in-depth post about how we convert our monitoring data to HAR and more.
Share it!
Waterfall Analysis diagram can easily be shared with your colleagues, without requiring direct access to your WatchMouse account. To facilitate this, all Waterfall diagrams include a sharable URL, for example:
http://www.watchmouse.com/en/waterfall.php?mid=3&rid=51138&lid=31991975&key=fc37ac9b0a0ba88.
Go ahead and click it!
What do you think?
The Waterfall Analysis diagrams went live today, and are not perfect yet. A few known issues are:
- It won’t work in Internet Explore 6, and only limited support is provided for Internet Explore 7.
- Not all timing parameters are available yet (e.g. resolve time). We are looking into adding these in the near future.
- The waterfall view doesn’t incorporate typical browser behavior (like parallel connections, pipelining, etc.) yet.
What do you think? Is this new feature useful for you? Please let us know what you think by leaving a comment, how you are using it, and what improvements you would like to see.