Google loves to make the web a faster place. They are obsessed with fast websites. So obsessed that they’ve made page speed one of the ranking factors for their search index (but remember there are over 200 ranking factors, so it’s not the be-all and end-all of search ranking).

And now Google has released an add-on for web servers (Apache) that aims to make websites even faster.

Google’s mod_pagespeed add-on

In a nutshell, Google’s new plugin for the Apache webserver (the most popular web server software) looks to speed up web pages by:

• Compressing Javascript and css code for faster delivery

• Compressing images even further

• Extending caching for images

None of this is revolutionary. However, Google is trying to make it easier for webmasters to do all of this without having to lift a finger.

Here at LexiConn we’re evaluating this new module, but we do not have any immediate plans to deploy it across all of our servers. Why? Because it’s quite new and untested for starters. And we’ve heard reports of the module causing some CPU and memory spikes in multi-domain hosted environments. So we’ll wait and see, and let the product mature a bit before considering it for production use.

There’s no need for Google to make your website faster

That’s right. You can do much of what the Google module does (and more) with a few simple changes:

1. Enable Compression

You can inform the webserver to compress many types of files before delivering them to the end user. This will speed up your webpages, as there is less data to transfer. The time required to compress and decompress the data is much less than the time it would take for the uncompressed data to travel from your website to the end user.

For websites running on a server using the Apache webserver (like our servers), you simply have to add 4 lines of code to your .htaccess file in your web directory:

AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/x-js application/x-javascript application/javascript text/javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

This will cause your html pages, css, javascript and xml files to be compressed before being downloaded by visitors on your site. It’s that easy.

2. Setup caching

Caching refers to informing web browsers to save a copy of certain types of files from your website when they are first viewed. This means that when these files (like images, css, javascript, etc…) are encountered on other pages, the browser will not try to re-download them. It will simply use a saved copy on the person’s local computer.

The net effect: Your website will seem much faster to the end user, as they are downloading much less data when browsing your site (most web browsers do this to a certain extent, but you can control for how long and which files).

Google recommends setting caching to at least one month or longer. The actual values you use would depend on how often those file types change. For images, a long period of time makes sense. If you only periodically update css and javascript files, maybe a week would be a good time. Here is an example (that would be added to your site’s .htaccess file):

# MONTH
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=2419200, public"
</FilesMatch>
 
# WEEK
<FilesMatch "\.(js|css)$">
 Header set Cache-Control "max-age=604800, public"
</FilesMatch>

3. Combine CSS and Javascript whenever possible in external files

Putting all of your CSS style definitions in one file, and all of your javascript code in one file is a great way to speed up page loads throughout your site. This will allow web browsers to only have to download this code once, and then it will be cached on all of your other pages. Your pages will be smaller and load faster.

If you use ShopSite as your ecommerce software, you may want to consider using ShopSite’s new “PUBLISH” custom files instead of the “INCLUDE” files for your css and javascript sections. A ShopSite INCLUDE will embed the contents of the file in *every* page created by the ShopSite template. If this include is simply CSS or JavaScript, it would help speed things up if this was in a separate file (a ShopSite PUBLISH file) that was loaded (linked) on each page instead.

ShopSite’s Template Cookbook has detailed information on using ShopSite PUBLISH files.

…

Of course, all the speed tweaks and changes in the world won’t help your site if it’s not hosted by a web host that puts an emphasis on fast loading servers. So make sure your hosting company provides the horsepower necessary to allow these speed changes to make a real difference to your customers as they browse your site.

Any other tips for faster loading web pages?

photo credit