How I increased by blog’s load speed by 50% using YSlow

Posted on August 10, 2007 at 12:57 pm

Make sure to read other posts from the FireFox YSlow series!

  1. Use YSlow Firefox add-on to analyze the performance of your web site
  2. How I increased by blog’s load speed by 50% using YSlow

YSlow is a great site performance tuning tool that every blogger and site owner should use! Using YSlow, I was able to have my WordPress blog load almost twice as fast as before by changing a few simple things. WordPress may not have the most optimized code in the world, but most blogs are running slow because of their own lack of understanding of what it takes to make a web site load quickly.

The Simple Stuff

Interestingly enough, I was able to see a 25% improvement in load time by doing the following things:

1. Removing SideBar Items – Removing blog directory links from my sidebar and cleaning it up so that it only contains a RSS subscribe, Pages, Categories, Archives, and two third-party links, one to Technorati and one for Spotplex. Earlier I had BlogTopList, BlogTopArea, and a few other blog ranking chicklets on my sidebar that were causing almost 10 DNS lookups each time the front page loaded.

I also removed all JavaScript trackers like MyBlogLog, except for Google Analytics. There’s really no need to be tracking using 5 different tracking sites, it only causes more DNS lookups. When you run YSlow, check #9 to see how many DNS lookups you currently have.

2. Delete Useless Plugins – Deactivated useless plugins that were only adding more code to my page or not very helpful in terms of getting traffic or helping a reader while on a page. For example, I was using FeedBurner’s FeedSmith code to add an Email This, Digg This, etc to my posts, but I already have ShareThis installed and a few other social bookmarking links at the top of my page.

Also, I had more than one tagging plugin installed, which was not helping in any way, so reduced it down to simply Technorati tags. Another thing that I did which seemed to help was to actually DELETE the deactivated plugins from the wp-contents\plugin directory. I’m not sure why, but this helped a somewhat also!

More Interesting Stuff

The above-mentioned steps are easy and a very quick way to lower the load time for your web pages, but there are a couple of more things that I was able to do that helped even more!

#6 on YSlow says that you should move scripts down to the bottom of a page rather than at the top because it holds up the rendering of the web page if they are in the HEAD section. I had no clue about this and had about 6 scripts that were in the head section. Moving the scripts down was not as simple as the other steps because you have to edit some of your plugins to have them write the “<script type=”text/javascript” src=…” in the footer section.

As a note, though, you will not have able to move ALL of your scripts down to the bottom because some will simply not work! Google Analytics, for example, will have to remain and I left my Subscribe Me in the HEAD also otherwise when you scroll over my Subscribe button instead of a list coming down, nothing would happen.

However, I was able to move my ShareThis, Subscribe Remind, and AJAX Edit Comments scripts to the bottom without any problems. Here’s how you can try moving your scripts to the footer:

1. Firstly, backup the original code or file for the plugin! If you mess it up, you’ll need to go back to the original!

2. Go to your Admin panel and click on Plugins. Find the plugin that YSlow is listing as an offender. Here is an example of mine currently:

3. Click on Edit to modify the plugin code. Now do a search in your browser for the phrase “wp_head“. wp_head is a hook that plugins can use to dump stuff into the HEAD section. Change wp_head to ‘wp_footer’ with the single quotes. Now your script code will be moved to the bottom. Sometimes you’ll see more than one wp_head in your plugin file, one for CSS and one for JS. Only change the JS line!

4. Save your file and test out what changes were made on the site. A few minor things changed on mine with the AJAX Edit Comments, but it was nothing major, just a smaller text box.

Shrink, Zip and Cache

Ok, so there are two more things that I did to get me to the 50% reduction in load time: got gzip to work with wp-cache and used JSMin to shrink the prototype.js file.

Getting gzip to work with WP-cache plugin takes a little more editing of your files, so again please make sure to backup everything in case it doesn’t work. Anyway, here’s the method I followed to update my wp-cache files. Remember, you should still keep gzip disabled in WordPress. Editing the wp-cache code makes the PLUGIN compress the JavaScript files, not WordPress. So keep gzip disabled in WordPress in order for it to work.

Lastly, point number 10 in YSlow is to have your JavaScript files Minified. This will basically remove all comments and extra line breaks, etc from the code making it much smaller, but impossible to read. To use JSMin, download it and copy it to the root of your C drive.

Copy down the JavaScript file you want to shrink and place it in the same directory as the JSMin executable. Go into DOS and CD into the directory with the files. Type jsmin <originalfilename.js >newfilename.js to convert the file.

Once the file is generated, copy it somewhere else, rename it to the original file name and replace it on your server. I was able to reduce my prototype.js file from 74KB to 54Kb using JSMin. Unfortunately, I’m still not sure how to move prototype.js to the bottom or if it’s even possible, but if you know, post a comment.

Conclusion

Even though my site has only a 62 when I run YSlow on it now, it’s far better than the 40 I was getting before I used it! If your WordPress blog or web site is running slow, get to working understanding the various issues involved in increasing site performance. Doing a few of these things might save you cash if you think you need a new host or dedicated hosting.

Now it’s time for me to figure out the expires header and etags, since I got F’s on both of those!

[tags]wordpress slow, web site performance, speed up web site, yslow, site performance, performance tuning, web site optimization[/tags]

» Filed Under Web Site Tips

Related Posts

Comments

7 Responses to “How I increased by blog’s load speed by 50% using YSlow”

  1. paulos72 said on :

    i tried your suggestion of moving sharethis to the footer and it caused me untold hell of broken plugin and then failure to get wp to load it after a fresh install. don´t know if somehow clashed with my theme but it would seem sharethis see it best to include it in the header and not the footer by default.


  2. Danish Backer said on :

    Can any tell me the syntax for doing this.
    Like “jsmin script.js script-min.js”
    the above one is not working, i think i forgot to add some attributes.

    I have done once. But I forgot it.

    Thanks in Advance.


    Pingbacks
  1. Wordpress Performance verbessern - Tipps und Tricks Says:

    [...] Online-Tech-Tips [...]

  2. Pingbacks
  3. 7 free SEO tools to analyze and optimize your website for speed and compatibility Says:

    [...] to ensure the highest possible grade. I wrote two articles on YSlow, one about how it helped me reduce the load time of my site by 50% and another on how to setup YSlow. Make sure to read them and install Firefox just for this [...]

  4. Pingbacks
  5. links for 2008-02-28 « Donghai Ma Says:

    [...] How I increased by blog’s load speed by 50% using YSlow (tags: web programming performance) [...]

  6. Pingbacks
  7. View slow loading web pages faster using Finch Says:

    [...] about 2 minutes before the web page would even come up! Apparently, this person does not believe in web site optimization and had hundreds of pictures on a single web [...]

  8. Pingbacks
  9. Check your website performance using PageSpeed Says:

    [...] 15Jun Previously, I wrote about a very useful add-on for Firefox called YSlow, that helped me decrease the load speed of my blog by almost 50%. You can use YSlow to analyze all the components of your web page to find out what aspects can be [...]

Please post your comments/suggestions!