Speeding up your web site by serving less files

July 12, 2009 by nuno costa 1 comment Stumble It del.icio.us

Last week I had to solve some performance problems on a customer’s site.

The problem was simple, the customer recently started a web campaign that attracted lots of traffic, he is getting around 70 000 unique visitors a day and the site is not as responsive has it was.

Has the site was already on its own dedicated server, I started with the obvious places

All images where saved with less quality to make them smaller, this was very time consuming, no automated process was used, each image was tested with different levels of quality until a good compromise between size and quality was found.

The designer should have done this in the first place, but they are usually performance impaired, so it’s up to the developer to solve this

The page size was down from around 800 kb to about 300 kb, nice job but not good enough

Another obvious action taken was to enable compression on the web server, so that javascript, html, and css where served gziped which saved  another 150kb

So I ended up with a 150kb page, an acceptable size if we consider that this site has lots of graphics

Now how could the site be faster? The answer was obvious reduce the requests made to the server.

This site was including about 9 javascript files:

  • 3 files for the javascript framework
  • 4 files for the framework plugins
  • One for the internal functions
  • And another one to correctly display flash

and 3 css files:

  • One for the framework
  • Another fro the site layout
  • And another one for one plugin

The javascript files were combined into one file, the same for the css, apart from the image size reduction this was the most noticeable change we made.

Now the browser only needs to request 2 files from the server instead of 12, and it makes a lot of difference!

So keep this in mind when developing your sites

Separate the code into several files for your convenience but for the user convenience put it all together when the site goes live!

I’ve coded a simple chache class for this called funil and soon it will be available for you in the php section

1 comment so far Add Your Comment

  1. [...] talked about how you can speed up your web site by serving less files, now its time to get our hands dirty and see how we can easily combine several files into [...]

More from francodacosta.com

© francodacosta.com - All rights reserved