-
Book Overview & Buying
-
Table Of Contents
ASP.NET Site Performance Secrets
By :
The Waterfall chart generated by Firebug as introduced earlier in this chapter obviously only works with Firefox, because Firebug is a Firefox add-on. This is not convenient if Firefox is not your favorite browser, or if you want to see how other browsers load content. Here are a few free alternatives for other browsers.
Fiddler is a proxy which logs all HTTP and HTTPS traffic between your browser and the Internet. It also allows you to change the incoming and outgoing data. Because it doesn't integrate with the browser itself as Firebug does, Fiddler works with any browser, including Internet Explorer.
Download at Fiddler from http://www.fiddler2.com/fiddler2/.
To generate a Waterfall chart with Fiddler, follow these steps:

If the bars on the timeline look hatched rather than solid, it means that Fiddler has used buffering, which distorted the chart. Click on the Streaming button to switch off buffering and start again.
This free, web-based service uses Internet Explorer to produce Waterfall charts. Simply visit their site at http://www.webpagetest.org/test and enter the URL of a page you're interested in. You can run tests from the United States, the UK, and New Zealand.
Because this is a web-based service, there is no software to install. On the other hand, it won't work for you if your site is behind a firewall, which probably applies to your development server.
Also, keep in mind that it runs Internet Explorer to produce its charts, so the charts you see apply to that browser even if you are visiting WebPagetest with Firefox!
Google's Chrome browser lets you generate a simple Waterfall chart right out of the box. You also get headers and other details about each file.
Download Google Chrome fromhttp://www.google.com/chrome.
To generate a Waterfall chart:
To see request and response headers, parameters, and so on, click on a filename to the left of the Waterfall chart. This replaces the Waterfall chart with detailed information for that file.

Apple Safari has the same underlying code base as Google Chrome, including the Web Inspector.
Download Apple Safari from http://www.apple.com/safari/.
However, before you can use the Web Inspector on Safari, it needs to be enabled first:

With the Web Inspector enabled, you can now generate a Waterfall chart in the same way, as with Google Chrome:
To see request and response headers, parametes, and so on, click on a filename to the left of the Waterfall chart. This replaces the Waterfall chart with detailed information for that file.
Change the font size
Change margin width
Change background colour