Search code examples
.htaccessoptimizationyslowmod-deflatemod-headers

Mod_deflate and mod_header settings?


I've finally gotten a VPS hosting account set up this allows me to use mod_deflate and mod_header (of course). I'm attempting to make my site faster by YSlow's guidelines which include gzipping (via mod_deflate) the pages and setting a long expire header.

What would the .htaccess code for this look like? I've seen various examples but I'm wondering what it would look like to fit those parameters.

For example

# Mod_deflate
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
SetEnvIfNoCase Request_URI .(?:exe|t?gz|zip|iso|tar|bz2|sit|rar|png|jpg|gif|jpeg|flv|swf)$ no-gzip dont-vary
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.[0678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent env=!dont-vary
</IfModule>

Solution

  • Strait from the html5 boilerplate

        <IfModule mod_deflate.c>
    
    
    # force deflate for mangled headers 
    # developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/
    <IfModule mod_setenvif.c>
      <IfModule mod_headers.c>
        SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
        RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
      </IfModule>
    </IfModule>
    
    # HTML, TXT, CSS, JavaScript, JSON, XML, HTC:
    <IfModule filter_module>
      FilterDeclare   COMPRESS
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/html
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/css
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/plain
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/xml
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/x-component
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/javascript
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/json
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/xml
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/xhtml+xml
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/rss+xml
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/atom+xml
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/vnd.ms-fontobject
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $image/svg+xml
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/x-font-ttf
      FilterProvider  COMPRESS  DEFLATE resp=Content-Type $font/opentype
      FilterChain     COMPRESS
      FilterProtocol  COMPRESS  DEFLATE change=yes;byteranges=no
    </IfModule>
    
    <IfModule !mod_filter.c>
      # Legacy versions of Apache
      AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
      AddOutputFilterByType DEFLATE application/javascript
      AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
      AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml
      AddOutputFilterByType DEFLATE image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype
    </IfModule>
    </IfModule>
    

    and

    <IfModule mod_expires.c>
      ExpiresActive on
    
    # Perhaps better to whitelist expires rules? Perhaps.
      ExpiresDefault                          "access plus 1 month"
    
    # cache.appcache needs re-requests in FF 3.6 (thx Remy ~Introducing HTML5)
      ExpiresByType text/cache-manifest       "access plus 0 seconds"
    
    
    
    # Your document html
      ExpiresByType text/html                 "access plus 0 seconds"
    
    # Data
      ExpiresByType text/xml                  "access plus 0 seconds"
      ExpiresByType application/xml           "access plus 0 seconds"
      ExpiresByType application/json          "access plus 0 seconds"
    
    # RSS feed
      ExpiresByType application/rss+xml       "access plus 1 hour"
    
    # Favicon (cannot be renamed)
      ExpiresByType image/x-icon              "access plus 1 week" 
    
    # Media: images, video, audio
      ExpiresByType image/gif                 "access plus 1 month"
      ExpiresByType image/png                 "access plus 1 month"
      ExpiresByType image/jpg                 "access plus 1 month"
      ExpiresByType image/jpeg                "access plus 1 month"
      ExpiresByType video/ogg                 "access plus 1 month"
      ExpiresByType audio/ogg                 "access plus 1 month"
      ExpiresByType video/mp4                 "access plus 1 month"
      ExpiresByType video/webm                "access plus 1 month"
    
    # HTC files  (css3pie)
      ExpiresByType text/x-component          "access plus 1 month"
    
    # Webfonts
      ExpiresByType font/truetype             "access plus 1 month"
      ExpiresByType font/opentype             "access plus 1 month"
      ExpiresByType application/x-font-woff   "access plus 1 month"
      ExpiresByType image/svg+xml             "access plus 1 month"
      ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
    
    # CSS and JavaScript
      ExpiresByType text/css                  "access plus 1 year"
      ExpiresByType application/javascript    "access plus 1 year"
      ExpiresByType text/javascript           "access plus 1 year"
    
      <IfModule mod_headers.c>
        Header append Cache-Control "public"
      </IfModule>
    
    </IfModule>
    

    also in YSlow: remove etag:

    # FileETag None is not enough for every server.
    <IfModule mod_headers.c>
      Header unset ETag
    </IfModule>
    
    
    # Since we`re sending far-future expires, we don't need ETags for static content.
    # developer.yahoo.com/performance/rules.html#etags
    FileETag None