htaccess leverage browser caching and compression
I’m a big fan of firebug and love to use the addon pagespeed from google which offers advice and tips for optimising the performance of your website and gives your site a rating out of 100. I do try and get as high a rating as possible from the pagespeed addon but i don’t get 100 i just like to get the most i can and then compromise on certain things. For example you can reduce the size of your html pages by removing space and extra characters that aren’t needed by “minifying” it but for my sanity i prefer not to do this so i have code i can easily read through etc. I recently used the pagespeed addon on my new website holding page Code Snippety i generally aimed to make sure i have between 60-80 out of 100. In this case because its just a holding page i got over 90 but again its really up to you how far you go with it and whats best for your visitors. Alot of the tips are very well explained by google so i’m just going to cover what i used for the sites caching and compression, i hope you find it useful. First off if you don’t have it on your web server already you will want to setup gzip and the expires modules for apache. In order to do this you will need to contact your host to set it up or log in to your server via ssh and run the following commands to get these up and running.
sudo a2enmod expires sudo a2enmod deflate
after thats done you will need to restart apache, you can do so by typing the following
sudo /etc/init.d/apache2 restart
Now thats all done and dusted, lets take a look at a htaccess file i’ve created.
There are 2 sections here that cover the compression that is deflate and gzip. To compress the output of say a css file you can see i’ve used the addoutputfilterbytype where you can use any mimetype at the end to reference different file types. Along with this i am using the files tag to compress any font files that end in .woff.
AddOutputFilterByType DEFLATE text/css <files *.woff> SetOutputFilter DEFLATE </files>
The other way i’ve compressed the files is using gzip tags for example compressing the images i have this line
mod_gzip_item_include file \.(html?|txt|css|js|php|pl|jpg|png|gif)$
So this covers all my compression needs now for the image caching i’ve setup the following, which will add an expiry cache date/time to the common image types. The M604800 actually stands for a week if you want to set a month you can use A2592000
<ifModule mod_expires.c> ExpiresActive On # Turn on the Expires engine # Expires a week after client accesses the file ExpiresByType image/jpeg M604800 ExpiresByType image/gif M604800 ExpiresByType image/png M604800 ExpiresByType image/x-icon M604800 </ifModule>