Three ways to improve your website's speed

Other than the obvious server and connection upgrades, there are in fact a lot of optimizations that could be made to your average website and web server configuration to serve up websites faster and save bandwidth.

There are 3 main points:

1.) Code optimization - In my opinion, optimization should always start at the code. In this day and age of incredible processing speeds and high-bandwidth internet connections, underlying efficiency often goes overlooked. But it shouldn't have to be that way. People are just as impatient now as they ever were and a slow and unresponsive online experience is a sure way to scare off users.

I suggest using an external CSS file to consolidate common formatting rules for your site. Likewise, use external JS files for any commonly used javascript functions. The benefit of using external CSS and JS files rather than inline code is that external files like these can be downloaded once and cached for the duration of a user's visit.

Also use short-hand CSS when possible, and try to make efficient use of CSS in general. Well-defined CSS rules can often make a substantial impact on cleaning up and shrinking your HTML files that would otherwise be packed with redundant formatting code.

Remove extranneous whitespace in your HTML, Javascript, and CSS. If you look for it, it's usually not hard to find extranneous whitespace. Sometimes you'll see trailing spaces at the end of a line, or perhaps your indentation uses individual spaces. But if you replace double-spaces with a single tab, that'll cut the amount of bytes for indentation in half.

2.) Use caching wisely - Cache, what a beautiful invention. There's no doubt cache can speed up the web. And you've probably seen how you can change your browser caching settings. But what you may not realize is that you can also control the way cache is handled on other users' computers by changing settings at your web server. In IIS it's called content expiration under the "HTTP Headers" configuration tab for a website. And in Apache you can use the mod_headers module to achieve the same effect. With either server what they can do is send special instructions via the Cache-Control HTTP header. And there can be a variety of caching rules sent inside this header that the browser will understand at the other end.

Now, by default Internet Explorer will cache files in its own temporary internet files directory, which is good. But, behind the scenes it still queries the web server upon every request to check if a file has been updated. And all of these roundtrip checks add up when you have dozens of images on a page. In this way Internet Explorer is a little like a child in the back seat asking, "Are we there yet?" or in this case, "Has this file been updated yet?" It's these roundtrips or nagging questions that you can eliminate with special caching settings at your web server. If you specify that a given file should expire 1 hour after it's initial download, then the browser knows to cache that file for an hour. So behind the scenes it's telling Internet Explorer to shut up for an hour, and THAT is a beautiful thing.

I suggest using content expiration like this to your advantage for any static content on your site. At the very least this should include CSS, JS, and image files. One easy way to do this is to make an "images" folder for your images and an "include" folder for your CSS and JS files. Then you can simply configure content expiration or caching rules at the web server for those folders. The benefits of this can be huge for both the server and the client. If you configure this for an HTML page as well, then it's possible to re-visit that page within the time limit and have it instantly load the entire page from browser cache. The result is an incredibly responsive site for repeat visitors.

3.) HTTP Compression - Much like zip-compression technology can drastically shrink a TXT file, HTTP Compression can drastically shrink the physical size of your content before it's transmitted to the user. Gzip compression (the most popular of HTTP compression technologies) has been supported in browsers for a long time. In fact, it dates back to the IE4 days. But even in the rare case that someone uses a browser that doesn't support it, the web server will be smart enough to send the data uncompressed. The only real penalty is that it takes a little more processing power to compress the files. But in the vast majority of cases CPU time is abundant but bandwidth is not. So these days it's almost silly not to use compression. Gzip compression can shrink your HTML, CSS, and JS pages down to 1/3 or sometimes 1/4 the size prior to transferring to the user's browser.

Below are a few excellent resources for those of you who want to learn more about these techniques and how to implement them:
- Fundamentals of Web Site Acceleration
- Caching Tutorial for Web Authors and Webmasters
- IIS Compression in IIS6.0