Richard Parnaby-King

Web Developer – PHP, Zend Framework and Actionscript 3

Posted on | | 1 Comment

As a web developer we should all know that Google now takes site load time into consideration when determining the position of a website in their results pages.

There are plenty of things to do during development to speed up a website (front-end caching, database caching, css sprite sheets, minifying javascript and css files, the list goes on), but the easiest optimisation is to include the following lines into your .htaccess file.

[c]
# expire 1 WEEK to images, css and javascript files

Header set Cache-Control “max-age=604800, public”

# add entity tag
FileETag MTime Size

# add gzip
SetOutputFilter DEFLATE
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/javascript application/x-javascript text/css font/truetype
[/c]

Expire Headers

By adding an expire header to your files, if a browser has already downloaded the file then it will not request the same file again.

Entity Tag?

From Wikipedia:

[Entity Tags are] mechanisms that HTTP provides for web cache validation, and which allows a client to make conditional requests. This allows caches to be more efficient, and saves bandwidth, as a web server does not need to send a full response if the content has not changed.

An ETag is an opaque identifier assigned by a web server to a specific version of a resource found at a URL. If the resource content at that URL ever changes, a new and different ETag is assigned. Used in this manner ETags are similar to fingerprints, and they can be quickly compared to determine if two versions of a resource are the same or not. Comparing ETags only makes sense with respect to one URL—ETags for resources obtained from different URLs may or may not be equal. So no meaning can be inferred from their comparison.

So, for each resource (file) we add a sort of hash. If the file ever changes, so does the hash and the server knows to send the new content to the browser if they are requesting the older file. In this case, we are using the file size as our ‘hash’.

GZip

GZip is used to compress the content that is being sent to the browser. Have you ever compressed a file or folder on your computer? Noticed how the file size is itty-bitty-tiny? GZip does the same, and your browser is clever enough to uncompress the content. As images usually compressed, there is no need to gzip them. In many cases, gzipping an image produces larger file sizes than just returning the images as they are.

GZip is best used on text files (such as html code, css and javascript)

Combination

So, in summary, we are telling your browsers not to download something unless they have not already downloaded it, then we are compressing the files that are being returned. The combination of these rules means that many of the common components of your website will load very very quickly for return visitors, and very quickly for new visitors.

Conclusion

By adding these lines to my htaccess file I have seen a marked decrease in the amount of time it takes for my site, and the sites of my clients, to load.

Category: Coding, SEO

Posted By:

Comments

  • ABOUT

    Having fifteen years of programming experience in PHP, Zend Framework and ActionScript3, I have a very strong working knowledge of object orientated programming.

    I am a PC Gamer! Playing FPS, RTS, RPG and the occasional MMO since 1996 I have a huge number of a variety of fast-paced games.

  • Recent Posts

  • Categories

  • RSS SUBSCRIBE TO OUR FEED