When it comes to optimizing for performance, one of the decisions that we will need to make is which metrics we’ll use in measuring how our websites perform. Some common ones include measuring how long it takes the browser to reach the ‘load’ event, watching the total number of requests, or the total file size. Or we may measure the time to reach DOM content ready, or the time to first paint. And although each of these can be valuable, the challenge is that these may or may not accurately represent the actual user’s experience. Meaning, a user may have a good experience if the site appears to load quickly, and is immediately usable, even though it may still be loading other things in the background, or further down the page.
One metric that tries to take this reality into account is Speed Index. What this measurement does is track the visual progress of what the user sees on the page, with the calculated score based on quickly this gets done. The final number is the average time it takes to display the visible parts of the page, with the lower the number the better. And because it’s based on what the user sees, it has a good correlation with the user’s experience of the page.
If you’re interested in the details of this metric, the Speed Index documentation includes the formula used to calculate this score, as well as more information on how the visual progress of the page is tracked.
How to Use
So how do you determine what the Speed Index for your web page is? To start out, you can simply go to http://www.webpagetest.org/ and run the test on a URL of your choice. Once the test runs, you’ll see information about various aspects of the page’s performance, including the calculated Speed Index.
How Low Should You Go
As mentioned earlier, when it comes to Speed Index, the lower the number the better. But how low is low enough? Last year, Tim Kadlec blogged about how fast was “fast enough” in regards to web performance. Paul Irish left a comment in response saying the goal should be a Speed Index of under 1000. Granted, that’s a pretty aggressive goal, but in a later talk, Irish makes his case on why such a low Speed Index matters.
Depending on your site, a score under 1000 may not be achievable immediately, especially if no optimizations have already been made. Nevertheless, it’s a good idea to see where your pages currently score, and then to see how much you can lower the score. To start out you may try to improve your score by 20-25%, or to outperform your best competition by the same margin.
Obviously, the point is not just trying to hit an arbitrary number, but to improve the user experience. And since Speed Index correlates well with the user’s perceived performance, it make sense to weigh it highly when analyzing your site. By setting the bar high when it comes to our metrics for web performance—as Irish does in his goal of a score under 1000—we force ourselves to not settle for what we think might be “good enough.” Instead we’re forced to reevaluate what we load on the page, when and how we load it, and if there are any better ways of of doing so. The net result is the end user gets a faster, better experience, which is not only what they want to have, but what we want them to have too.