High Performance. What does that really mean in the web world?
Well, if you’re a developer, you might be thinking about how efficient your scripts and functions run, whether they do or don’t bleed any resources, whether they properly dump resources when they’re done with them, could the code be written any more efficiently so it runs more quickly.
If you’re a designer, you might be thinking about optimizing images or SWFs so they are smaller in file size, but not so small as to diminish quality. Cut a few colors out of a GIF, decrease the quality of a JPG, remove unnecessary objects in Flash, etc.
If you’re on the business side of the web world, you might be thinking about how to reduce the bandwidth and storage space required to host and serve your websites to end-users. Smaller files require less storage space and less bandwidth. Fewer trips to the server cause less stress and less wear-and-tear on your infrastructure. All of this means a lower operating cost.
Or if you’re an end-user, all you probably care about is “how fast does the page load”.
Well, it turns out that all of these views are correct: they are all high performance in the web world. And, more than likely, they’re all related.
But how do you know how high performance your websites are, other than typing a URL and clicking “Go”? Here are a few tools that can help you monitor the performance of your websites.
YSlow: http://developer.yahoo.com/yslow/
This add-on for the Firefox web browsers gives the developer a fairly detailed inspection and evaluation of the assets required to render your webpage, including whether or not you are using a CDN, GZip and Expire Headers, or whether you are using “too many” images, etc. YSlow provides a really great starting point, while its creator, Steve Souders’ book High Performance Web Sites provides even greater insight.
IBM Page Detailer: http://www.alphaworks.ibm.com/tech/pagedetailer
This free download from IBM gives the developer an “under the hood” look at the downloading process of their websites. While this somewhat overlaps with the Net feature of YSlow, it definitely gives you a more detailed report on the time required for each element of your webpage, including the amount of time it takes for all the steps between making the initial server request and viewing the completely rendered webpage.
AOL PageTest: http://www.download.com/AOL-Pagetest/3000-12775_4-10807039.html
I had witnessed this tool some time ago, but had not fallen in love with it. Much like my first experience with the Firefox add-on Firebug, I think I was simply overwhelmed, because not long ago I had the opportunity to meet Dave Artz from AOL, and when he started dancing through what PageTest can do, I was much more impressed (kind of like the difference between watching a two year with a drum and two sticks, then getting to watch someone like Thomas Lang with the same…). PageTest gives an amazing overview (and underview, for that matter!) of your page’s performance: what assets are being called by the page and how long each is taking to download, breaking each line into the respective “pieces” of the download, including initial request, DNS lookup, server request, reply, etc., everything that happens until the asset is delivered to the client.
Brain fried yet?
Happy testing,
Atg