FREE THOUGHT · FREE SOFTWARE · FREE WORLD

Best Practices for Speeding Up Your Web Site with Htaccess

AskApache Page Speed and Yslow ScoreI have written more than a few articles detailing how to improve the speed of a website, and due to popular demand, this post will detail all the latest and greatest caching tricks and techniques that I utilize and love. The AskApache Best-Practices.


Google Page Speed Online

Google has everything you need to know about speeding up your website including an online tool called Page Speed Online. Using this tool will provide everything you need to get your site faster. Here's the results for the askapache home page, which is very fast.

Googles Page Speed Online Tool

##############################################
#       HEADERS and CACHING              #
##############################################
ExpiresActive On
ExpiresDefault M600000
FileETag MTime
#Header unset ETag
#Header unset Last-Modified
Header unset P3P
Header unset Pragma
#Header unset Cache-Control
Header set Expires "Thu, 15 Apr 2012 20:00:00 GMT"
Header set Cache-Control "public,max-age=29030400"



##############################################
#       COMPRESSION             #
##############################################
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript application/javascript text/css application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html



##############################################
#       HEADERS and CACHING              #
##############################################
ExpiresActive Off

FileETag INode Size
#Header unset ETag

Header append Cache-Control "public"
#Header set Expires "Thu, 15 Apr 2012 20:00:00 GMT"
Header unset Last-Modified
Header unset P3P
Header unset Pragma

#ContentDigest On

Header set Cache-Control "must-revalidate, proxy-revalidate, max-age=60"

ExpiresActive On
ExpiresDefault A60




Header unset P3P
Header unset Pragma
#Header unset ETag
#Header unset Cache-Control
#Header unset Expires
#Header unset Last-Modified
Header set Cache-Control "public,max-age=29030400"
#Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"


##############################################
#       COMPRESSION             #
##############################################
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript application/javascript text/css application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html



SetOutputFilter DEFLATE
#Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"


# ================================================================================================================================================================
#  MOD_HEADERS CACHING {{{1
# ================================================================================================================================================================

# UNSET DEFAULT SENT HEADERS {{{2
# ----------------------------------------
Header unset Pragma
#Header unset ETag
#Header unset Cache-Control

# SET CACHE_CONTROL HEADER DEFAULT {{{2
# ----------------------------------------
Header set Cache-Control "public,max-age=29030400"


# CACHE-SETUP FOR STATIC SITE FILES {{{2
# ----------------------------------------


# UNSET HEADERS {{{3
Header unset P3P
Header unset Pragma
#Header unset ETag
#Header unset Cache-Control
#Header unset Expires
#Header unset Last-Modified

# SET CACHE-CONTROL AND EXPIRES HEADER {{{3
Header set Cache-Control "public,max-age=29030400"
#Header set Expires "Thu, 15 Apr 2011 20:00:00 GMT"
#}}}3


#}}}2





# ================================================================================================================================================================
#  COMPRESSION SETTINGS {{{1
# ================================================================================================================================================================

# AddOutputFilter DEFLATE {{{2
# ----------------------------------------
# The AddOutputFilter directive maps the filename extension extension to the {{{6
# filters which will process responses from the server before they are sent to the client. This is in
# addition to any filters defined elsewhere, including SetOutputFilter and AddOutputFilterByType
# directive. This mapping is merged over any already in force, overriding any mappings that already
# exist for the same extension. }}}6
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript text/css application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html



SetOutputFilter DEFLATE
#Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"








# ================================================================================================================================================================
#  MOD_MIME, MOD_NEGOTIATION {{{1
# ================================================================================================================================================================

##############################################################################################################################################################
###
###       MOD_EXPIRES
###
##############################################################################################################################################################
#

# 2 HOURS

ExpiresActive On
ExpiresDefault A3600



ExpiresDefault A360000

Am I an Expert

Now, most of the time I am not an expert. In this case I am not a world-renowned expert, but I'm no punk either.

  • I've examined the source code for Mozilla Firefox and other browsers (open source or not) to see how they handle caching.
  • I've dug deep into the source code of major servers like Apache and Nginx to see how they create and handle caching.
  • For the most part, I'm up to date on most all of the RFC's regarding HTTP technology like caching. Mostly because I wrote an entire browser by hand.
  • I've taken popular tools like Yslow and Page Speed completely apart, examining their grading methodologies and formulas in great detail.
  • I not only have built websites using these methods, I also host websites for others.
  • I do freelance professional consulting to web hosts, site providers, and site owners on speeding up their sites

Turn Gzip Compression On

This goes in your root .htaccess file but if you have access to httpd.conf that is better.

This code uses the FilesMatch directive and the SetOutputFilter DEFLATE directive to only target files ending in .js or .css



SetOutputFilter DEFLATE

Add Future Expires Headers

This goes in your root .htaccess file but if you have access to httpd.conf that is better.

This code uses the FilesMatch directive and the Header directive to add Future Expires Headers to certain files.


Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"

Add Cache-Control Headers

This goes in your root .htaccess file but if you have access to httpd.conf that is better.

This code uses the FilesMatch directive and the Header directive to add Cache-Control Headers to certain files.

# 480 weeks

Header set Cache-Control "max-age=290304000, public"


# 2 DAYS

Header set Cache-Control "max-age=172800, public, must-revalidate"


# 2 HOURS

Header set Cache-Control "max-age=7200, must-revalidate"

If you are using far Future Expires Headers and Cache-Control (recommended), you can do this for these files.


Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"

You can use the HTTP Header Viewer Tool to check it.

Header unset Pragma
FileETag None
Header unset ETag

# 1 YEAR

Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified


# 2 HOURS

Header set Cache-Control "max-age=7200, must-revalidate"


# CACHED FOREVER
# MOD_REWRITE TO RENAME EVERY CHANGE

Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified

Turn ETags Off

This goes in your root .htaccess file but if you have access to httpd.conf that is better.

This code uses the FileETag and the Header directive to remove all ETags from being sent.

Header unset ETag
FileETag None

Please don't turn off ETags and Last-Modified headers for your .html files, leave one of them ON. (I use Last-Modified for .html).

Remove Last-Modified Header

This goes in your root .htaccess file but if you have access to httpd.conf that is better.

This code uses the FilesMatch directive and the Header directive to remove all Last-Modified Headers from being sent.


Header unset Last-Modified

How it Works

By removing both the ETag header and the Last-Modified headers from your static files (images, javascript, css) browsers and caches will not be able to validate the cached version of the file vs. the real version. By also including a Cache-Control header and Expires header, you can specify that certain files be cached for a certain period of time, and you magically (this is a really unique trick I promise) eliminate any validation requests!!

  1. Make Fewer HTTP Requests
  2. Use a Content Delivery Network (CDN)
  3. Add Expires or Cache-Control Header
  4. Gzip Components
  5. Put Stylesheets at Top
  6. Put Scripts at Bottom
  7. Avoid CSS Expressions
  8. Make JavaScript and CSS External
  9. Reduce DNS Lookups
  10. Minify JavaScript and CSS
  11. Avoid Redirects
  12. Remove Duplicate Scripts
  13. Configure ETags
  14. Make Ajax Cacheable
  15. Flush Buffer Early
  16. Use GET for Ajax Requests
  17. Postload Components
  18. Preload Components
  19. Reduce the Number of DOM Elements
  20. Split Components Across Domains
  21. Minimize Number of iframes
  22. Avoid 404s
  23. Reduce Cookie Size
  24. Use Cookie-Free Domains for Components
  25. Minimize DOM Access
  26. Develop Smart Event Handlers
  27. Choose <link> Over @import
  28. Avoid Filters
  29. Optimize Images
  30. Optimize CSS Sprites
  31. Do Not Scale Images in HTML
  32. Make favicon.ico Small and Cacheable
  33. Keep Components Under 25 KB
  34. Pack Components Into a Multipart Document
  35. Avoid Empty Image src
Best Practices for Speeding Up Your Web Site

Optimization

 

 

Comments