35+ Ways To Speed Up Your Web Site
One of the oldest and most authoritative resource on improving front-end performance is the list of 35 best practices identified by the Yahoo Exceptional Performance team. The main contributor of that list is Steve Souders who also went on to write books on Web Performance Optimization and possibly contributed to PageSpeed Rules while he was at Google.
The original 35 best practices are neatly structured into 7 categories. There are additionally some best practices identified by other Web Performance Analysis & Optimization tools. I plan to consolidate them all (points other than those in the original list will be italicized & linked) so that I have a single list which is easy to refer. I'll keep looking out for newer findings from the WPO community and add them here as & when I find them.
So here goes my custom list:
Content
1. Make Fewer HTTP Requests
2. Reduce DNS Lookups
3. Avoid Redirects
4. Make Ajax Cacheable
5. Postload Components
6. Preload Components
7. Reduce the Number of DOM Elements
8. Split Components Across Domains
9. Minimize Number of iframes
10. Avoid 404s
Server
1. Use a Content Delivery Network (CDN)
2. Add Expires or Cache-Control Header
3. Gzip Components
4. Configure ETags
5. Flush Buffer Early
6. Use GET for Ajax Requests
7. Avoid Empty Image src
8. Specify a character set [PageSpeed]
9. Serve resources from a consistent URL [PageSpeed]
Cookie
1. Reduce Cookie Size
2. Use Cookie-Free Domains for Components
3. Serve static content from a cookieless domain [PageSpeed]
CSS
1. Put Stylesheets at Top
2. Avoid CSS Expressions
3. Choose <link> Over @import
4. Avoid Filters
5. Remove unused CSS [PageSpeed]
6. Use efficient CSS selectors [PageSpeed]
JavaScript
1. Put Scripts at Bottom
2. Make JavaScript and CSS External
3. Minify JavaScript and CSS
4. Remove Duplicate Scripts
5. Minimize DOM Access
6. Develop Smart Event Handlers
7. Defer loading of JavaScript [PageSpeed]
8. Avoid document.write [PageSpeed]
Images
1. Optimize Images
2. Optimize CSS Sprites
3. Do Not Scale Images in HTML
4. Make favicon.ico Small and Cacheable
5. Specify image dimensions [PageSpeed]
Mobile
1. Keep Components Under 25 KB
2. Pack Components Into a Multipart Document
3. Defer parsing of JavaScript [PageSpeed]
4. Make landing page redirects cacheable [PageSpeed]
work in progress..
The original 35 best practices are neatly structured into 7 categories. There are additionally some best practices identified by other Web Performance Analysis & Optimization tools. I plan to consolidate them all (points other than those in the original list will be italicized & linked) so that I have a single list which is easy to refer. I'll keep looking out for newer findings from the WPO community and add them here as & when I find them.
So here goes my custom list:
Content
1. Make Fewer HTTP Requests
2. Reduce DNS Lookups
3. Avoid Redirects
4. Make Ajax Cacheable
5. Postload Components
6. Preload Components
7. Reduce the Number of DOM Elements
8. Split Components Across Domains
9. Minimize Number of iframes
10. Avoid 404s
Server
1. Use a Content Delivery Network (CDN)
2. Add Expires or Cache-Control Header
3. Gzip Components
4. Configure ETags
5. Flush Buffer Early
6. Use GET for Ajax Requests
7. Avoid Empty Image src
8. Specify a character set [PageSpeed]
9. Serve resources from a consistent URL [PageSpeed]
Cookie
1. Reduce Cookie Size
2. Use Cookie-Free Domains for Components
3. Serve static content from a cookieless domain [PageSpeed]
CSS
1. Put Stylesheets at Top
2. Avoid CSS Expressions
3. Choose <link> Over @import
4. Avoid Filters
5. Remove unused CSS [PageSpeed]
6. Use efficient CSS selectors [PageSpeed]
JavaScript
1. Put Scripts at Bottom
2. Make JavaScript and CSS External
3. Minify JavaScript and CSS
4. Remove Duplicate Scripts
5. Minimize DOM Access
6. Develop Smart Event Handlers
7. Defer loading of JavaScript [PageSpeed]
8. Avoid document.write [PageSpeed]
Images
1. Optimize Images
2. Optimize CSS Sprites
3. Do Not Scale Images in HTML
4. Make favicon.ico Small and Cacheable
5. Specify image dimensions [PageSpeed]
Mobile
1. Keep Components Under 25 KB
2. Pack Components Into a Multipart Document
3. Defer parsing of JavaScript [PageSpeed]
4. Make landing page redirects cacheable [PageSpeed]
work in progress..
Hey Anil, thanks for the useful tips. I just wanted to add MaxCDN Tools - http://tools.maxcdn.com/ to the comments. It offers variety of performance tools which can be added to several categories of yours.
ReplyDelete