Curtis Henson/articles

Speed Up Your Website: Part Deuce

Posted

Last week I wrote a post about what I was doing to speed up my website. While that post is an informative, well-written piece of literary genius, it didn’t go into a whole lot of detail. That detail is in this post, because two posts are better than one. I’ve tweaked, found problems, fixed a few problems, and learned a thing or two. I also learned there is a lot to learn.
I’ll mostly talk about wordpress in this post, but many of these tools and resources are not wordpress specific.

Taming HTTP Requests

If you’re like me, you have plugins, more than a few plugins. While on their own plugins are not the problem, the files they load however are a problem. Seeing these plugins load javascript and css files on every page even though they were not being used quickly became a pet peeve (like a pet bird that poops on the furniture). What to do? Chuck ‘em in the trash. Find a plugin that behaves itself. Cforms was a plugin loading on every page, I knew for sure this was a quality plugin so I took a look at the options page and sure enough I was able to limit the loading to my About page only.

Also consider using CSS sprites rather than loading a lot of images.

The point is, look around for a way to limit the HTTP requests, if something is loading that shouldn’t be get rid of it. This is one of the easiest ways to speed up your website, so limit your requests.

Database Queries

As someone who designs themes for public use, I usually don’t hard code links, titles, and whatnot even on my personal sites. This creates excess SQL queries, which take time, and time, keeps on ticking. Don’t use a wordpress tag or database query when simple beautiful fast HTML will do.

This goes for any CMS, and while this may be more relevant for large sites it can’t hurt to think big when your a little guy.

WP Super Cache

This one is wordpress specific, but there are lots of ways to cache your website. WP Super Cache converts your page into a static, pure HTML file for users that have not logged in or left a comment. There are two big advantages to this:
1. You don’t make any unnecessary database queries(see above point). This keeps your database server from crashing.
2. Most of your visitors will get a compressed static HTML file. This is the fastest way to get the page loaded and up on the screen. Once the user leaves a comment or logs in, they see a wp-cache page which is more dynamic, yet still fast.

If you plan on receiving a lot of traffic, WP Super Cache is a must, and at the very least you should use WP-Cache. I use wp super cache on and love it, it has not failed me yet.

phpSpeedy

I use used phpSpeedy to take care of compression. Getting this to work can be tricky depending on your website, but it is generally easy to set up. The author of phpspeedy is very supportive so I suggest at least trying this out. It is still very new but the speed at which it has been developed has made me a believer.

There are two versions of this script, a wordpress plugin and a php script to be used however you want. I don’t use phpSpeedy anymore as I do all the things it does via the server now, in my case I found this simpler.

Expires Header

An expires header essentially tells the browser to cache things and for how long. At first this may be confusing as there is some Apache mumbo jumbo talk to get around, but it is really easy. If you are at all familiar with .htacces files you will have no problem setting far futures expires headers.

Here is an example of the code you would add to your .htaccess. This bit of code is going to add a expires header to your media files.

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
</FilesMatch>

NOTE: Far future expire headers are going to be for files that do not change regularly. The browser is going to cache the file and not look back until the year 2010! The name of the file must be changed if you change the file(using version numbers is a good way to do this, which can also be automated).

That being said, you can set the files to expire in any amount of time you want, I currently have most images set to expire after a few weeks. Like so:

ExpiresActive On
ExpiresDefault A0
 
<FilesMatch "\.(gif|jpg|jpeg|png|swf)$">
ExpiresDefault A3600
Header append Cache-Control "public"
</FilesMatch>

Compressing Files

If you have files that need compressed and wordpress, your CMS, or some other software isn’t already compressing them, you can do it all via the server(which is also faster). Askapache.com has a tutorial on adding compression. Even the smallest files can be reduced and this can have a major impact on loading times.

Minify Javascript and Move It Down

You should minify/compress your javascript and put it in the footer. This ensures your content(the most important thing) is loading before all your interface slickness. Another thing to not here is watch your analytic software, a lot of times this can greatly slow down a page if left at the top.

Just the Beginning

There are plenty of reasons why a website can be slow, and a way to fix each and every one of them. I have only gone into what I believe are the easiest and best ways to speed up a website. If you want more, tell me, or check out the sites below.