Measuring website speed

Date: Sun Sep 09 2007
In Usability Testing they start with the question What to really measure. If you're going to properly measure how "fast" or "slow" your site is, and know when you're making real improvements, it is important to understand what you're measuring.

In general we're talking about the time between a user making a request (e.g. clicking on a link) and the result of that request being displayed in the browser.

Some sorts of interactions users will do are:-

  • Mouse around the page seeing what parts of the page react to the mouse
  • Click on links
  • Enter data in form fields
  • Click on buttons related to a form, and e.g. cause a page to load based on the form data
  • Interaction with DHTML elements that use javascript in the browser

Let's focus on the ones which cause a new page to load. The things which effect load time are:-

  • Time to send the request to the server
  • Time for the server to process the request and send back the page
  • Time for requests of any subsidiary components to load such as images or javascript
  • Time for the browser to parse through all loaded components and format and display them on the screen

The speed test simply downloads a page and all of its subsidiary components, it does not do this in a browser, and it does it only the one time when you request the download. Because the download is not in a web browser, the time it reports does not include the time required for the browser to format and display it on screen. Still it is a useful tool.

Firebug is an excellent aid for web designers, and it is able to report webpage download times. It breaks down the download speed for you into the individual components showing the time required for each one, arranging the time as a linear progression making it easier to understand why the download time is what it is.

YSlow is an addition to Firebug developed by Yahoo. Yahoo has developed some rules for high performance websites and YSlow measures all these performance issues, giving you a report of how to improve your website speed.

One thing I learned using YSlow is that the majority of the time to load the page is not on loading the initial HTML page, but is the time related to the other parts of the page.

The load time is more than the time to download the data involved with the page. The page also must be rendered.. a page with complex components in it, a page where javascript actively fiddles with the page content, etc, those add to the time required for browser rendering.

High Performance Web Sites is an interesting video presentation by the Yahoo in charge of the group who developed and wrote YSlow.

Optimizing Page Load Time is a detailed deep dive by a Google engineer.

The Caching Tutorial goes deeply into controlling cachability of objects on a page. As is