United States|United Kingdom|India
sudeepg
Jun 08, 2010

 

File Caching is powerful and is useful for files on web server that do not change. Images, pdf files and other static content can be cached, thus reducing the network traffic between the server and the client.

In this tutorial you'll learn how to do file caching using Apache .htaccess file.

 

 

Measure Your Web Performance

There is a great tool: http://www.webpagetest.org/test that you can use to measure your performance. It would suggest your first load time and repeat time view as well along with suggestions.

 

 

 

 

Enabling .htaccess on your Linux server

 

First step is to check that .htaccess is enabled on your linux server.  If it is not, you would have to find this line in Apache's httpd.conf:

AllowOverride None

Change it to read as follows and restart the server.

AllowOverride All

 

 

Making Changes in .htaccess One by One:

 

1. Keep-Alive:

 

If you are not using any caching server for files, KeepAlive On helps in delivering all the static files in a single connection. Find your httpd.conf and make KeepAlive On. If you have a static files serving mechanism (like having squid or serving static files through high throughput server like lighttpd), KeepAlive off usually is a positive turn on the performance.

 

2. ETags:

 

  You can change all the headers you want, but if the ETag associated with a file is always the same, caching will never work the way you expect. In most situations, you should turn your ETag headers off.

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header unset ETag
FileETag None
</FilesMatch>

3.  Expire Header:

 

We need to expire static files into far-future, since, we don't want them to be called from server again and again on every page load  as follows:

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header set Expires "Thu, 31 Dec 20125 10:00:00 GMT"
</FilesMatch>


4. Enable mod_deflate for Apache 2.x

 

<IfModule mod_deflate.c>
<FilesMatch "\.(jpg|gif|png|js|css|html)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>