apt get life

Life around technology

You are here: Home / Archives for page speed

Speed up Apache Websites with Expires Headers

by

Page speed can be a big issue for site owners, developers and systems administrators alike. There are many things you can do at an application level to improve performance, but that takes a long time to review, write, test and implement. What about the quick gains, the things you can do quite easily that will improve performance? Well it turns out that you can speed up an Apache based webserver by simply enabling a module: expires headers.

Expires headers are part of the the computer code that gets exchanged when you access a page. You browser requests a page by sending a request to it, and the server responds with information indicating what it is that has been returned. As part of this response there’s a section called “Expires”. This indicates when the content that has been accessed on the website is going to “expire”. To understand this a bit better, you need to know that when a website’s content is loaded, it’s downloaded to your computer to be rendered in your browser. Once the site is on your screen, if expires headers are not set, each time you load the site it’s going to be downloaded again. This is a performace hit to you, your internet connection and your computer. Expires headers tell the computer to store content temporarily (“Cache” the content) on your computer. When you visit the site again in 5 minutes, if expires headers are set correctly, you’ll only download part of the information on the page.

So what should be cached? Well, here’s what content types I tend to set expires headers on:

  • Images (jpg, png, gif)
  • CSS
  • Javascript
  • content such as mp3, mov, mp4 and others that don’t change regularly

How do you do it? You can Speed up websites that operate on Apache using mod_expires. This is really simple to setup and configure if you know how to configure sites on the command line.

Enable the module

a2enmod expires

Edit the configuration file. This can be done in either /etc/apache2/sites-enabled/mysite.conf or /etc/apache2/mods-enabled/expires.conf. The virtualhost configuration file will enable it for a single site, the mods-enabled configuration file will enable it for all sites. Choose one and edit it with a command line text editor like nano. Enter the following:

          ExpiresActive on

          ExpiresByType image/jpg "access plus 30 days"
          ExpiresByType image/png "access plus 30 days"
          ExpiresByType image/gif "access plus 30 days"
          ExpiresByType image/jpeg "access plus 30 days"

          ExpiresByType text/css "access plus 7 days"

          ExpiresByType image/x-icon "access plus 1 month"

          ExpiresByType application/pdf "access plus 1 day"
          ExpiresByType audio/x-wav "access plus 1 month"
          ExpiresByType audio/mpeg "access plus 1 month"
          ExpiresByType video/mpeg "access plus 1 month"
          ExpiresByType video/mp4 "access plus 1 month"
          ExpiresByType video/quicktime "access plus 1 month"
          ExpiresByType video/x-ms-wmv "access plus 1 month"
          ExpiresByType application/x-shockwave-flash "access 1 month"

          ExpiresByType text/javascript "access plus 1 week"
          ExpiresByType application/x-javascript "access plus 1 week"
          ExpiresByType application/javascript "access plus 1 week"

Now restart or reload apache to apply the configuration

service apache2 restart

You can see from the code that the expires time has been set by content type. Each is different, depending on how often it’s expected to change and how big the file types are going to be. For example – a movie file is unlikely to change frequently, but is likely to be large, so if it’s got an expires header telling the browser to store it locally for up to 1 month after the date on which it was first accessed it. This makes the site faster to load. Now when someone loads a site on your server, it will store content after the initial page load and reduce subsequent loading time.

 

For further information on improving page speed you can check out Yahoo’s excellent article here: https://developer.yahoo.com/performance/rules.html

Why not checkout the Firefox and Chrome plugin “YSlow” which checks a range of potential speed issues and offers solutions:

Google also has some useful tools and guides which can be found here: https://developers.google.com/speed/

Moz also has a brief article on the subject here: http://moz.com/blog/15-tips-to-speed-up-your-website