Using Google Page Speed for web app optimisation

2 minute read

Warning – if you’re not techie, you’ll probably want to skip the full article – here’s the conclusion: we’ve made Sign-Up.to run a bit faster for you.

Still here? Read on!

One of the great things about running Sign-Up.to is that we’re always developing our applications. When we’re not working on major new features (or whole new services) we’re tweaking existing functions to make them work as well as possible.

This constant development certainly keeps things interesting, but it does means that every now and again it’s important to take a few steps back and make sure that everything is working together as efficiently as possible.

Previously, this has been a pretty soul-destroying, tedious task. After 6 years of development Sign-Up.to contains millions of lines of code and our CSS files alone were several thousand lines long.

Then we found Google Page Speed. A great plugin for the absolutely indispensable Firebug extension for Firefox, Page Speed allowed Neil and I to get some major optimisations done in a few hours on Friday afternoon.

page_speed

As well as making it easy to identify unused CSS code (although it doesn’t play too well with dynamically loaded content) Page Speed also makes it easy to identify image assets that are a bit bloated (even providing optimised versions for you!) and Javascript files that could benefit from minifying.

Even better, it helped us to debug on-the-fly compression of the data we serve, so that we can further reduce data transfer and so load times. All of the text-based data we serve (HTML, CSS etc.) is now compressed but images are left alone – as our images are already optimally compressed further compressing them actually increases the file size – something that was easy to identify using Page Speed’s ‘Show Resources’ tool.

The end results? Taking our Dashboard page as an example we’ve reduced the CSS used by about 50% through trimming unused styles; image sizes by about 20% by identifying a badly compressed set of navigation images and sorting out on-the-fly compression has reduced data transfer by a whopping 54%. Not bad for a couple of hours work!