Case Study: The Up Group Website Performance
I was recently contacted by Manne from The Up Group. He wanted me to take a look at their site (built on ModX) to see what was making the site (and it’s homepage predominantly) load slowly and what could be done to improve the performance of their website www.theupgroup.com.
Before moving straight into the codebase to see what I could glean from it I ran several tests to using some web page performance applications.
The initial resulting score from GTMetrix was -
On average it took the sites homepage 4.3 seconds to download and have a time to first byte at a very slow average of 2.4 seconds so was lots of room for improvement.
Asset location and HTTP requests
Duplication of file requests
Going through the page I noticed there were two calls to the favicon.ico and also two calls to the Google Analytics code. Removing these reduced two unneeded HTTP request. A nice and simple quick win.
Minify & GZip
To that end minifying both the CSS and JS files gave a saving of around 80kb on the total page weight.
The site has a logo and two social icons in the header, on the homepage there is a black and white image of a man hold the company ident as well as 20 logos from companies that The Up Group has worked with. I used ImageOptim to squeeze the file size of the site logo, icons and ‘man’ as well as the group of logos used.
For the logos I also put them into one image sprite sheet and used CSS to save 19 separate HTTP requests for the page.
Once all these were done I went back to the .htaccess file to extend the caching period of the files so that the browser would keep them in the hope the next time the visitor goes to the site they wouldn’t have to download everything all over again.
In doing all these things above I then ran the site through the tests above again and found that there was a significant improvement. Both the download time and the time to first byte were improved as were the scores -
I don’t think that’s a bad effort for around a days work. I also gave the sites homepage a facelift, but I’ll keep that for another blogpost.
(note: the site has had a complete redesign by others since I did this work. The results may vary differently if you tested now).