Roughly three weeks ago I updated JKOgden.net’s back-end and front-end; this is more of an intermediate’s guide to enabling mod_deflate and other tweaks and is partly intended for VPS servers as far as enabling mod_deflate.
First I’d like to talk a little about mod_deflate, first and foremost the module needs to be enabled in your Apache 2.x configuration so if it is not already you must recompile Apache and if you’re going to do that I would also suggest installing APC Accelerator which is a caching system for PHP. I have read some articles that you can add code to your .htaccess file to enable mod_deflate without having it enabled in your Apache configuration, however I have found that not to be true by looking into Apache log (/usr/local/apache/logs/error_log).
What is mod_deflate and why is it so important? When you request a file such as http://www.jkogden.net/index.php, your browser talks to a web server. The conversation looks a little like this:
- Browser: GET /index.php HTTP 1.1 Accept-encoding gzip,deflate
- Server: looks for index.php (/var/www/…/index.php)
- Server: HTTP/1.x 200 OK No encoding available 300KB <html></html>
- Browser: 300KB? Whoa, that’s a lot of data
As you can see, with all of the html tags, text, etc the text is quite large and is an inefficient usage of bandwidth.
What do you normally do when a file is too big to send? You use your favorite compression utility and zip it. If we could send a .zip file to the browser (index.php.zip) instead of plain old index.php, we’d save on bandwidth and download time. The browser could download the zipped file, extract it, and then present it to user.
Here’s an updated conversation when accessing a site configured with mod_deflate:
- Browser: GET /index.php HTTP 1.1 Accept-Encoding: gzip,deflate
- Server: looks for index.php (/var/www/…/index.php)
- Server: HTTP/1.x 200 OK Content-Encoding: gzip 30KB
- Browser: 30KB? Nice, let me unzip it
Second half of the entry:
So, first thing, is to SSH into your VPS box; these commands may vary from distro to distro; I’m using CentOS 5.x:
- yum update – to make sure your system is up-to-date
- /scripts/upcp –force
- Make sure you have 200MB free memory by running free -m and then run the following commands to shut down the web services:
- service httpd stop
- service mysql stop
- service cpanel stop
- /scripts/easyapache
- I would select “Previously Saved Config”
- Select Apache 2.2 (if you’re upgrading from 1.x or 2.0.x make sure your scripts are compatible with Apache 2.2.x)
- Select PHP 5 (again, make sure all scripts are compatible)
- Select “Exhaustive Options List” and ensure you check “mod_deflate”
- Compile, wait and once finished start your services back up
- Now that you have mod_deflate installed you must create a config file for your mod_deflate settings
Now that you understand what mod_deflate is at least the intermediate’s version of what it is lets move onto configuring the config file.
- pico /usr/local/apache/conf/deflate.conf
- I will show you my configuration file and then explain what different portions mean:
-
<IfModule mod_deflate.c> 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 SetEnvIfNoCase Request_URI \.avi$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.mov$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.mp3$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.mp4$ no-gzip dont-vary SetEnvIfNoCase Request_URI \.rm$ no-gzip dont-vary AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/atom_xml AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-httpd-php AddOutputFilterByType DEFLATE application/x-httpd-fastphp AddOutputFilterByType DEFLATE application/x-httpd-eruby AddOutputFilterByType DEFLATE text/html DeflateCompressionLevel 9 BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html DeflateFilterNote Input instream DeflateFilterNote Output outstream DeflateFilterNote Ratio ratio LogFormat '"%r" %{outstream}n/%{instream}n (%{ratio}n%%)' deflate </IfModule> - Exit and save the file, then run pico httpd.conf and add this line near the top:
Include "/usr/local/apache/conf/deflate.conf"
- Exit and save the file, to make this change stick during the next update run this command:
/usr/local/cpanel/bin/apache_conf_distiller --update
-
SetOutputFilter DEFLATE will tell Apache to deflate everything, from what I’ve read though that is not a good idea if you have files that are already compressed such as mp3, jpg, png, gif, zip, rar, wma, mov, etc. so you will want to specify what you want compresses and not compressed.
Not to compress:
- SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dor
- …
- etc.
Compress:
- AddOutputFilterByType DEFLATE text/plain
- …
- etc.
Usually the default gzip setting of 1 is fine, but you can specify the level by using this command,
DeflateCompressionLevel 9
, however it will utilize a little more of your CPU time.
Older browsers will have trouble unzipping compressed data so it is recommended by Apache to add the following:
BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Finally you can keep track of the compression in order to evaluate the effectiveness of the use of mod_deflate in your server.
The following directives define some variables, such as:
- instream : the size in bytes of the data as received by the DEFLATE filter.
- outstream : the size in bytes of the compressed data as returned from the DEFLATE filter.
- ratio : the compression ratio, (Output/Input)x100
Keep in mind that this configuration file will be used by all hosts in the VPS server and nothing will need to be added to your .htaccess file(s). To test your configuration changes you can use these tools:
- Online: Use the online gzip test to check whether your page is compressed.
- In your browser: Use Web Developer Toolbar > Information > View Document Size (like I did for Yahoo, above) to see whether the page is compressed.
- View the headers: Use Live HTTP Headers to examine the response. Look for a line that says “Content-encoding: gzip”.
I hope that you found this article helpful; it took me a couple of days to research on forums and searching through other guides to combine and complete what I have just described.
Now, on to front-end performance tools. I know that there are many tools available but I am only going to list my favorite:
- Clean CSS
- Used to sort, clean and compress your properties
- Javascript compressor
- Used to compress your code into one line
- PNG Optimizer
- Compresses png file formats losslessly
- Smush it
- Used to compress jpg and png file formats losslessly
- Open Web Tools Directory
- Collection of many web developer tools, not really a performance tweaking site but a handy site to have non-the-less
- HTML Tidy
- Sorts your HTML code, again probably not a performance hit but helps keep your code markup looking neat
- YSlow
- Nice tool that works with Firebug to grade your site on performance, it’s very difficult to achieve an A, but fun to attempt
Liked this entry?
Subscribe to the RSS feed.
Comments are welcome.
Whoosh! Went right over my head. But to be honest, I didn’t read it all. Clicked a link and got intimidated. But I trust you understand it all! :-)
Beth
Hi,
Very interesting article.
I am using Apache 5.5 on Windows 2003
Can you please shed some light on whether i can use this in the above environment? if so, could you please tell me how?
Please mail me at: prajwol@hbl.com.np
Thanks
Hi, sorry for the late reply. Unfortunately I am not familiar with settings this up on a Windows Server.