How to make your website faster with mod_pagespeed from Google

Posted on

I've become optimisation mad lately, minifying any CSS file I find, compressing any JavaScript I can and squeezing what I can out of your old friend JPEG. These are the things I'd normally do as standard during any old site build but lately after working on some more asset and performance heavy sites I've begun to dig a little deeper into the world of website performance.

I probably shouldn't, but I'm getting kicks out of making sites load tenths of a second faster. *

The night of writing this post, I stumbled across mod_pagespeed from Google and instantly started tweeting some interesting things about it. Moments later, I'd installed it on this server and started comparing the load times... But before we go any further let me give you a very quick introduction.

What is mod_pagespeed?

If you hadn't already guessed, it's an Apache module, and a good one at that. Three small installation steps with no configuration and you will instantly see performance benefits! A bold statement (that I did extract from the below video) but it's doing some very clever things under the hood.

The crux

The whole idea is that all your usual optimisation: compression, concatenation and minifying is done for you (plus a lot more). Things you don't need to do after installing mod_pagespeed:

This video covers it's functionality in much further detail.

Getting started

First SSH into your server and download the module's package file. I'm using the Ubuntu 32bit version. (View the docs for further installation instructions for CentOS/Fedora and package URL's for 64bit packages.)

wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-stable_current_i386.deb

Then run these next two commands to complete the install.

dpkg -i mod-pagespeed-*.deb
apt-get -f install

And... your done!

Check that it's installed correctly

To do this you can run a simple curl command to check to see if the pagespeed headers are present.

curl -D- http://example.com | less

You should see the following somewhere near the top of that result.

X-Mod-Pagespeed:

Speed test

Next, a head to head. Head over to Which Loads Faster? and put your URL in the left hand side and in the right but followed by "?ModPagespeed=off". This will give you a test between how fast your site loads with and without pagespeed. You should see some improvement, even if your sites already heavily optimised. If you don't it may be time to start playing with some of the filters available to you.

Using WordPress?

I did experience one issue with mod_pagespeed and WordPress in the admin area, but this can be resolved by adding the following line to your .htaccess file or virtual host config.

ModPagespeedDisableFilters rewrite_javascript

Did it work for you?

Please let me know if this helped you out or any particularly good filters that are working for you!

* I definitely should be

4 comments

  • Steve Lacey wrote on

    Wow, awesome, the only downside is now I have to tell my boss that there actually is a silver bullet, or at least something close to it- I call 5 minutes of dev for a second or so less load time is a pretty solid ROI.

    I’ve installed and tested this on my site, seems to be consistently reducing load time by ~1.25s for both first and repeat views (although it was pretty slow to start with!).

    Pending further testing will probably be rolling this out across the work stack next week.

    Thanks for posting!

    • benjamin wrote on

      Nice to know it’s working Steve. 1.25s is definitely worth it.

  • Jeremy wrote on

    I like the code highlighting you have here. What are you using? Thanks, Jeremy.

Add your comment

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>