Web Caching : Jargon Buster

An effective caching setup has benefits for you and your website’s visitors. It can save bandwidth, improve page load times and lighten the load on your server. But what exactly is caching?

A cache is a temporary store of data that helps future requests for that same information be served faster.

In our case the data we are talking is the sort of resources that make up a typical web page: HTML, CSS, JavaScript and images.

Developer discussions about caching often involve a lot of jargon. You might hear terms like ‘garbage collection‘, ‘priming‘, and ‘flushing‘ bandied about. And yes, the specifics of an effective caching setup can be deeply technical. But the basic principles are fairly straight-forward and understanding them can help optimise your own caching setup.

An analogy we often use is to imagine you work on an email support desk and all day long people are contacting you with very similar questions. Without caching you would manually type out the same reply each time. But by ‘caching’ a set of common replies to simply copy and paste you could not only deliver responses faster but also respond to many more enquiries in a much shorter space of time.

Browser Caching

As the name suggests, browser caching involves temporarily storing web resources in an individual user’s browser. When they first visit a page assets like images and style sheets are downloaded as normal. But along with them the server also sends a message that tells the browser ‘hey, this file doesn’t change that often so why don’t you keep a temporary copy at that end in case you need it again.’ Now if the same page is visited again, or the user visits other pages that use the same assets, instead of requesting them again from the web server the browser just loads from it’s local cache. By skipping this request – wait – download process performance can be significantly improved.

Assets like images are typically given a very long cache life (days or weeks) as they are less likely to be updated regularly. Whereas the HTML a page is constructed from can change frequently so shorter cache times (in hours) are more typical. If you are using a content management system such as WordPress with one of the popular caching plug-ins then this expiry information will get set for you. So it isn’t something you would have to go through and specify manually on a file by file basis.

There are times (particularly during a website’s development) when you might want to empty your browser cache to make sure you are seeing the latest version of a page. Often simply reloading the page a couple of times will do the trick, but most browsers also have an option to ‘clear temporary files’. You can also use the Private Browsing mode, which usually bypasses any browser caching.

Server-Side Caching

With database-driven platforms like WordPress a large part of the time it takes a server to deliver a webpage can be spent piecing it together from different bits of content pulled from the database.

To get around this, on the server side we can use page caching to temporarily store a constructed version of a page. This not only yields a significant improvement in page load time our visitors, but can also help us deliver more consistent performance at much higher traffic loads as the database server isn’t having to answer every single page request.

Like our browser cache this page cache usually expires after a set period of time, typically within a couple of hours – It will also normally expire if the content of the page in question is updated in the meantime. – At this point the cache is cleared and the next time the page is requested by a visitor it will be rebuilt afresh by the server.

Ideally we would like our website visitors to always be hitting a cached page, as we know that delivers the best performance. To help achieve this we can have the server periodically do what is called priming the cache. Essentially re-building the page cache automatically after it expires. If your website has thousands of pages, permanently holding a cached version of each may not be desirable, but priming the cache with the most frequently requested ones makes a lot of sense.

CDN Caching

We have written before about the benefits of Content Delivery Networks. A CDN is a network of servers that sits between the user’s browser and your web server. The first time a file is requested the CDN fetches it directly from your web server and passes it on to the visitor, but after that it keeps its own copy that will be served to future visitors who request it. By using a network of servers around the world and serving from the one that is geographically closest to each visitor the response time can be a lot faster. You are also lightening the load on your server as a fraction of the requests now hit it directly, which can be particularly helpful if you traffic suddenly spikes.

Together browser, server-side and CDN caching can all improve performance and help you do more with fewer hosting resources. So we believe tuning your caching setup to the sort of traffic your website receives is always time well spent.