Putting My Blog on a Diet

Earlier this week, I decided that I needed to put my main site on a diet.

Simply put, the loading time of the site was nowhere near my personal standard and, though no one had complained about the time it took to load, I wasn’t pleased with the numbers I was seeing and even Google Webmaster Tools was providing less-than-subtle hints I needed to improve.

So I set my mind to do just that. I took an afternoon to research the problem and try to devise a solution. Fortunately, I didn’t need the entire time or even a quarter of it.

In fact, after about 30 minutes of research and just nine minutes of actual work, I was able to to shave an estimated four seconds off my site’s loading time. How did I do it? The answer is below.

Diagnosis: Slowdown

I used two different tools to attempt and diagnose the problem. The first was YSlow, an extension for Firebug, which is in turn an extension for Firefox.

Yslow allows you to test the loading time within a page and gives your site a grade from A to F as to how well it performs. Initially, YSlow gave my site an E, the next-to-worst grade, but many of the alleged problems, such as the lack of CDN and Gzip compression, appeared to be errors on YSlow’s part. With other issues, there wasn’t much I could do about as the errors came from external sources, such as statistic programs.

So I decided to change tactics and use Pingdom’s Site Speed Test. This test works by having their server pull down a copy of your Web page and then tell you how long it took to load the various elements. Elements that take a long time need to either be optimized or removed.

Initially, my site loaded in 5.6 seconds, a decent time by itself, but I knew that end users were likely experiencing longer delays.

The good news was that the test provided two very powerful insights. First, I realized that Disqus, which I was using as a comment manager, was adding significant loading time as it loaded all of the variables. Second, two plugins I was using were forcing the download of very large images and/or JavaScript files that weren’t necessary on most pages.

With this information in hand, I went into action.

Taking Action

Using WordPress, I simply went in and disabled the three plugins involved. The process only took a few seconds.

Most of my time was spent purging my site’s cache and making sure that I had a clean copy of my front page stored before going back and redoing the test.

When I did, I was very surprised by the results.

9 Minutes Later

After double checking that everything was ready, I re-ran the test and the results were stunningly different.

Free from the burden of loading many different Disqus elements as well as heavy JavaScripts/images, the load time of my site went from 5.6 seconds to 1.5 seconds, an over four second and an over 55% decrease in load time. Rerunning the test gave similar results, almost always below two seconds (outside of a few outliers).

In YSlow, my grade improved to a “D” though the errors and other issues remained. I immediately sent out messages to many of my friends to test the site and all reported a marked improvement in loading time. Though there were still issues to iron out, and still are, the site was clearly performing much better.

Though I am still not satisfied with the site’s performance, I am happier with it now than I was before I made the changes. Clearly, they were a major step in the right direction.

Some Basic Advice

If you’re a blogger in a similar position, in addition to running the two tests above, here are five easy things you can do to ramp up your site’s performance drastically without changing the look of your site.

1. Disable Unneeded Extensions: Weigh every extension you are using to see if you really need it. Though different extensions will affect your site in different ways, many will add new elements into your page that can drag it down.
2. Use Good Caching: WP Super Cache is a great caching plugin for WordPress as is the more advanced W3 Total Cache. Caching plugins are probably the only plugins that actively make sites faster in the long run.
3. Maintain Your Databases: Routinely repair and optimize your databases (as well as back them up obviously). Doing so will help keep your databases speedy and ensure your server has to do as little work as possible to load your site.
4. Optimize Images: Make sure the images that you use are sized correctly before being uploaded, are in the correct format and have been optimized for use on the Web. Using large or high-resolution images unnecessarily can be a tremendous drag on your server.
5. JavaScript at Bottom/CSS at Top: Finally, put non-urgent JavaScripts at the bottom of your template, in the footer, and ensure that all of your CSS files are in the top. Though this may not improve your scores significantly on Pingdom’s test, it can drastically improve the user’s experience.

But while these are some good tips, you should definitely give YSlow a test and see if it can offer you additional suggestions or if any issues stick out in Pingdom’s test results. You might be surprised what happens if you address those issues.

Bottom Line

To be certain, speed is not everything but without a reasonably fast site you do have nothing. The reason is that, if your site takes to long to load, readers won’t even bring up the first page and, if they do, they won’t stick around long or come back.

The good news is that, with a few simple changes, you can probably drastically improve your site’s speed, though you may have to sacrifice some of the more beautiful elements.

The other good news is that, as I was working on this article, Disqus reached out to me on Twitter and said they are working on a fix for their loading issues. So, I may be able to comfortably go back to it again soon.

In the meantime, I’m going to keep an eye on my site’s loading time and keep tweaking it until I’m finally happy with it.

Written by Jonathan Bailey from Plagiarism Today
Posted on February 4th, 2010 and filed under Design & Coding
Do not forget to subscribe to our RSS feed for updates

11