The Dangers of Browser Caching

3 minute read

Recently my Granddad who is a follower of a privately run local weather website asked me about a problem he was having. He’d visit that site once and get the current information but even after closing and reopening his browser it wouldn’t update on any subsequent visits. He could only get newer information after clearing his browser history.

Now, when he mentioned this to me I knew exactly what would be causing this but it didn’t make any sense why anyone would do this. The administrator of a website can set various “HTTP headers”. These headers include information about the server, any compression the page uses, various security features and more (the browser also sends headers to the server). In this case what is being used is a header called “Cache-Control”.

What is the Cache Control header?

The Cache Control header is an incredibly useful header. It allows a web page to tell the client’s browser to cache resources. For instance, on this site the stylesheet (which tells your browser colours, spacing and so on for the site), the fonts and the images are cached. This means you only download them once and not on every page load - saving massive amounts of time and effectively providing a free performance boost.

The Problem with Caching

When used properly it’s a really useful tool but part of the header defines how long the browser should cache the resource for. This part is called “max-age” and is followed by the number of seconds the resource should be cached for. For instance, 4 hours is 14400 seconds which is written as “max-age=14400” in the header. This value is chosen by the administrator and is mainly influenced by how often the resource is updated.

Now, where the weather website have gone wrong is their cache policy specifies that .gif files (a type of image file which they use to display the weather information) should be cached for 604800 seconds… AKA an entire week. This would be fine for images that don’t change but I don’t know about you but up-to week old weather doesn’t seem very useful to me.

This is a perfect example of the type of problems that can be caused by mis-configured headers. I’ll be writing more about various headers in the future (there’s quite a few and they’re rather interesting). Also, I’ve emailed the owners of the weather site about this and I’m waiting to see what they say.

Sidenote: Some people might not have the issue my Granddad and I are seeing because their browser may ignore the Cache-Control header or handle it differently. Also, if you manually clear your browser cache you’ll download the a fresh copy of all resources.