What is cache busting?
A cache-buster is a unique string which is appended to a URL in the form of a query string.
It is generally not read by the server-side and is used purely to form a unique URL. For example:
When a webpage is downloaded, any associated files are also downloaded and stored in the browser’s cache. This is for performance purposes so that the webpage doesn’t have to download the files every time the page is refreshed.
However, as a developer, if you are to make a change to any of those files, you need to ensure the client will download the latest version.
Therefore the cache-buster query string can be updated so that the browser doesn’t recognise the file in it’s cache and downloads a new version.
Here a different types of cache-buster methods you can use:
When the file is updated, all references to the file could be manually updated to increment a version number.
However this isn’t a clean solution because this task will have to be carried out every time the file is updated. And in cases where its forgotten, browsers will potentially still use an older version of the file.
The current date/time could be appended to the reference so that every call to the webpage will return a unique cache-buster. For example this can be done like so in .NET MVC:
However this won’t be great for performance, and defeats the point of browsers caching files at all.
Software Version Cache-Buster
Another method of cache-busting is to use the Software Version of the application. This ensures that whenever a new version of the application is deployed, the cache-buster will be updated:
The down-side to this method is that a change could be made to the application which creates a new version number even when a change to the file has not been made. In which case the browser would download the file again when it already has the file stored locally in cache.
My preferred method of cache-busting is to create a hash of the content and use this as the cache-buster.
This is the same method that ASP.NET MVC Bundling & Minification uses for it’s cache-busting.
The advantage of this is that you could set a really long
max-age value, such as a 1 year, in your
Cache-Control header and be confident that this won’t be persisted once the content has changed.
Whichever method you choose, cache-busting is a great way to ensure your clients are using the most up-to-date version of your files.