headphono.us

In this series, we take a look at how to reduce load times across your site. The first part of the series tackles one of the most important techniques which usually proves to drastically reduce your load times. Usually it’s not enough to use HTTP Compression alone (best results when coupled with smart caching), but I’ve seen anywhere between 40%-80% speed increases.

So how is it done? Well, two different ways, depending on your Apache version and configuration options. To check what version you’re running (for the folks who use a hosted solution), try this on any unix shell:

$> curl -I http://headphono.us
HTTP/1.1 200 OK
Date: Wed, 02 May 2007 02:49:22 GMT
Server: Apache/1.3.37 (Unix) mod_throttle/3.1.2 DAV/1.0.3 mod_fastcgi/2.4.2 mod_gzip/1.3.26.1a PHP/4.4.4 mod_ssl/2.8.22 OpenSSL/0.9.7e
X-Pingback: http://headphono.us/xmlrpc.php
X-Powered-By: PHP/5.2.1
Content-Type: text/html; charset="UTF-8"

As you can see, I’m using Apache 1.3.37 (yes, thats a very 1337 version). You can also see that my Apache has been compiled using mod_gzip — which is exactly what I need. Follow the directions below depending on the version you’re running.

If you’re using Apache 1.3, you’ll need mod_gzip. I won’t get into the process of recompiling/installing Apache with mod_gzip, but look around and you’ll find lots of places that explain it. From this point on, I’m assuming you have mod_gzip already.

You’ll want to edit either the .htaccess file (per directory on your server) or the httpd.conf file for a global Apache configuration. I usually like to edit my .htaccess files so that I can move my directories across servers and they maintain the compression settings.

The following explicitly states the following:

• All text files (text/css, text/javascript, text/html, etc.) will be compressed.
• All javascript application files (that aren’t text/javascript) will also be compressed.
• All images (which are usually compressed already) need not be compressed.
• All PDF documents need not be compressed.

mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript$
mod_gzip_item_exclude mime ^image/.*$
mod_gzip_item_exclude mime ^application/pdf$

If you’re using Apache 2.x, you’ll need to use mod_deflate. Again, I won’t get into the complexities of recompiling Apache with mod_deflate (see here for that info).

To turn on mod_deflate:

SetOutputFilter DEFLATE

To explicitly exclude files from being gzipped, add the following for every type of file you want to exclude:

SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI \.(?:exe|t?gz|zip|bz2|sit|rar)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI \.pdf$ no-gzip dont-vary

But if you want to explicitly include the files:

AddOutputFilterByType DEFLATE text/*
AddOutputFilterByType DEFLATE application/ms* application/vnd* application/postscript

You can even turn on gzip compression for certain directories:


AddEncoding x-gzip .gz
AddType application/x-javascript .gz
AddOutputFilter DEFLATE js


So only javascript files in the subdirectory “js” would be compressed.

Now if you wanted to get real funky (and you should), you’ll want to be aware and compress according to the browser clients that can handle HTTP compression. You can tweak compression by limiting them to certain browsers:

# Netscape 4.x has some problems...
BrowserMatch ^Mozilla/4 gzip-only-text/html

# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won't work. You can use the following
# workaround to get the desired effect:
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html

This should be a pretty basic (if very brief) introduction to HTTP compression. I highly suggest the further reading below, and really fine tuning your Apache settings to get the best results. Using Firefox plugins like Firebug also help analyze and debug your settings to make sure your gzip compression is working and is being effective.

Further reading:

• Speed Web delivery with HTTP compression
• WebPerformance Web Compression Library
• Apache 2.x mod_deflate documentation

Next up: Application level caching (PHP)