First download/install firefox add-ons Firebug and YSlow
1. Make Fewer HTTP Requests
Combined files are a way to reduce the number of HTTP requests.
CSS Sprites are the preferred method for reducing the number of image requests.
Image map combine multiple images into a single image.
2. Use a Content Delivery Network
Intermediary caching is cache between the browser and the server, so use CDN like facebook
fbcdn.com.
3. Add an Expires Header
For static components: implement “Never expire” policy by setting far future Expires header.
For dynamic components: use an appropriate Cache-Control header to help the browser with conditional.
Expires: how long the web content cacheable.
max-age: the browser will request the new content after the age limit.
<FilesMatch “\.(jpg|jpeg|png|gif|swf|css|js|ico|pdf)$”>
Header add “Expires” “Mon, 15 Nov 2020 00:00:00 GMT”
Header add “Cache-Control” “max-age=31536000”
</FilesMatch>
4. Gzip Components
<IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>
5. Put CSS at the Top
6. Move Scripts to the Bottom
7. Avoid CSS Expressions
background-color: expression( (new Date()).getHours()%2 ? “#B8D4FF” : “#F08A00” );
8. Make JavaScript and CSS External
9. Reduce DNS Lookups
10. Minify JavaScript
<IfModule mod_rewrite.c>
RewriteRule ^css/(.*\.css) combine.php?type=css&files=$1
RewriteRule ^js/(.*\.js) combine.php?type=js&files=$1
</IfModule>
11. Avoid Redirects
12. Remove Duplicate Scripts
13. Configure ETags
This is the unique identifier for comparing cached files.
<FilesMatch “\.(gif|jpg|jpeg|png|swf|css|js|html?|xml|txt)$”>
FileETag none
</FilesMatch>
More page optimization techniques are here below:
http://developer.yahoo.com/performance/rules.html
Make Ajax Cacheable
Flush the Buffer Early
Use GET for AJAX Requests
Reduce the Number of DOM Elements
Split Components Across Domains
Minimize the Number of iframes
No 404s
Reduce Cookie Size
Use Cookie-free Domains for Components
Choose <link> over @import
Optimize Images
Don’t Scale Images in HTML
Make favicon.ico Small and Cacheable
Keep Components under 25K
http://www.leigeber.com/2008/04/introduction-to-web-caching/
We can use Server Caching for higher level of caching your PHP.
