A few days ago Google came out with Google Page Speed Online. This is a great tool for anyone to test how their web page is performing, but it’s nothing new when it comes to reporting performance.
YSlow
YSlow was the first of the products released by Yahoo as a plugin for Firefox. It was developed by Steve Souders, author of the High Performance Websites: Essential Knowledge for Front-End Engineers and Even Faster Web Sites: Performance Best Practices for Web Developers.
“Yahoo!’s Exceptional Performance team has identified 34 rules that affect web page performance. YSlow’s web page analysis is based on the 22 of these 34 rules that are testable. These testable rules are listed below roughly in order of importance and effectiveness. Studies have shown that web page response time can be improved by 25% to 50% by following these rules.”
- Minimize HTTP Requests
- Use a Content Delivery Network
- Add an Expires or a Cache-Control Header
- Gzip Components
- Put StyleSheets at the Top
- Put Scripts at the Bottom
- Avoid CSS Expressions
- Make JavaScript and CSS External
- Reduce DNS Lookups
- Minify JavaScript and CSS
- Avoid Redirects
- Remove Duplicate Scripts
- Configure ETags
- Make AJAX Cacheable
- Use GET for AJAX Requests
- Reduce the Number of DOM Elements
- No 404s
- Reduce Cookie Size
- Use Cookie-Free Domains for Components
- Avoid Filters
- Do Not Scale Images in HTML
- Make favicon.ico Small and Cacheable
Page Speed
Steve then went across to Google and developed Page Speed for Firefox, and then the Page Speed Chrome Extension.
Page Speed is a browser extension for Google Chrome and Firefox. It runs a number of diagnostic tests against a web page, and analyzes the page’s performance on a number of “rules” that are known to speed up page load time. The rules are based on general principles of web page performance, including resource caching, data upload and download size, and client-server round-trip times. They examine factors such as web server configuration, JavaScript and CSS code, image file properties, and so on. For each rule, Page Speed gives a general score, using a simple red-yellow-green grading scheme, and suggests specific techniques for correctly implementing each rule. It also provides some automatic optimization of external resources included on a page, such as minifying JavaScript code and compressing images.
mod_pagespeed
Steve wasn’t quite finished with those two books with their awesome recommendations, nor was he finsihed with the two plugins that gave you the tools to see how the site was performing and instructions on how to fix them.
He decided that he would take the development out of the web developers hands and make the server do all the hard work for you. mod_pagespeed takes an ordinary HTML page and does a lot the performance enhancements for you.
Personally I disagree with this approach as it’s automating something that you should be doing already. Automation is a guessing game, not an exact science, and this kind of performance will make you lazy. You can always do things better yourself by tweaking each element to the best of your ability, rather than relying on code to do it for you. It will also put an additional load on your server!
Which do I use?
When it comes to these two tools you might ask which one is better or which one should I use? The answer is both of them. While they have been developed by the same person they work in slightly different ways and focus on slightly different areas of performance. It’s important that you run both to get a wholistic picture of the performance of your site.
Remember! – performance matters. It is the first impression that everyone gets when they visit your site even before the first pixel is loaded