TL;DR: Cache invalidation is the practice of updating or clearing cached content when it becomes outdated to ensure users receive the latest information. To use cache invalidation effectively, employ versioned file names, set appropriate cache expiration times, implement cache purging mechanisms, and use cache-control headers.
Cache invalidation is a caching process that allows you to keep your website optimized, save server resources, and reduce the loading time of your pages.
In fact, it’s such a powerful technique that we use it as part of our caching mechanism to speed up thousands of sites all over the world.
However, in order to fully understand how cache invalidation works, we need to start with an explanation of the basics.
Let’s dive in!
What is caching, and how does it work?
Before proceeding with cache invalidation, we have to lay the foundations of how the web works and what caching is.
Your website is simply a collection of files - an HTML document, images, videos, CSS, and JavaScript. Those files are stored on your origin server.
To access your website, your visitors send HTTP requests through their browsers (clients) to your origin server, which sends back HTTP responses. The entire communication looks like this:
After the server responds, the browser assembles this info into a fully functioning webpage.
However, a couple of issues might occur during this process:
- It could take up to several seconds before your client’s browser receives the first byte of the response (Time to First Byte). These couple of seconds are enough to reduce your chances of engaging that user immensely.
- Servers have a limit on the number of requests they can handle. As traffic increases, the number of requests increases as well, and they go into a queue, leading to drastically longer response times.
To attack these problems, you can try caching your content.
Caching is the process of storing a copy of your website files in a different place called a web cache.
A web cache acts as an intermediary between your visitor’s browser (client) and your origin server. They store HTTP responses (representations) and serve them to clients. The process of web caching looks like this:
To better understand how caching works, here’s my favorite caching example.
It comes from Peter Chester, who asked the audience at one of his speeches ‘What’s 3,485,250 divided by 23,235?’. Finally, after quite a few silent moments, someone was able to work out the answer and shout it out (it’s 150, by the way).
Right after, Peter asked the question again, and this time around, everyone was able to call out the number immediately. Applied to the context of your website, the basic idea of caching is to do the time-consuming calculations once and then (swiftly!) serve the already available answer.
To summarize, the benefits of caching are:
- Reduced load time
- Reduced bandwidth usage
- Reduced downtime
- Caching (storing) data in different locations (CDNs)
Obviously, caching offers a lot of benefits that improve your website’s performance. However, a single question might have struck your mind - what happens when I update my website’s content?
How Does Cache Affect Your Website?
You already know the benefits of serving cached content, and we can agree that they sound pretty appealing.
However, there is this tiny inconvenience of dealing with content updates and making sure that your visitors see the latest version of your website.
Since the cached snapshots (also known as representations, or simply - copies) are technically static HTML files, they cannot update themselves.
It’s much like taking a photo of your dog right after playing outside in the rain and trying to compare it to a picture of him after a bath. They simply won’t match. Hence, a new snapshot needs to be made that replaces the old one.
One way to make this happen is by taking new snapshots of your content frequently. This, however, will increase the load on your application.
So on the surface, it appears that there is a dilemma that website owners face when it comes to caching.
On the one hand, you have the option of lower application load and faster response time, achieved through caching content for longer periods. And on the other hand, you would want to serve fresh content as soon as you publish it online.
It might seem like we reached a dead end.
Well, not exactly!
What is Cache Invalidation and How Does It Work?
Cache invalidation is a caching process that declares cached content as invalid (or stale). Once invalidated, a representation stops being the most up-to-date version of a file.
The ultimate purpose of cache invalidation is to solve both of the problems mentioned above without making a compromise.
However, it is good to know that invalidating your cache isn’t the only solution when it comes to optimizing your website’s performance.
In some cases, you might want to purge your cache.
Cache purging (also known as “cache flush”) refers to the active removal/deletion of resources from the cache immediately.
Let’s say that you have an eCommerce site whose prices are updated daily. You might want to see the updates immediately, and one way to do it is by deleting the cache.
I know it sounds tempting to have complete control over your website’s cache and content. And you might already lean towards the idea of cache purging every time you make a change.
However, there are some situations where purging your cache could damage your website’s performance.
For instance, say you're running a seasonal marketing campaign that attracts a lot of visitors to your website. During this high-traffic period, you decide to update some content and delete your cache so that your visitors can immediately see the changes.
However, when a purge occurs during a high traffic period, your visitors are no longer served from cache. And your server has to work extra hard to generate new cache files, resulting in increased bandwidth usage, server resources, and slower loading times.
In this case, it’s better to invalidate your cache so that you can refresh the files in the background, and once everything is ready - start serving the latest version of your site from the cache.
Important Note: The one downside of the cache invalidation mechanism is that slightly outdated representations may be served while new ones are being prepared in the background. However, this ensures that visitors always see fast pages.
I know that it might seem too complicated to set the right caching on your website, but bear with me. We have the solution!
Cache Invalidation with NitroPack
We understand that setting up a cache invalidation on your website might be a lot of work. In fact, Phil Karlton famously said, ‘There are only two hard things in Computer Science: cache invalidation and naming things.’
Luckily, with NitroPack, you wouldn’t have to worry about how difficult cache invalidation is - we provide it pre-configured and ready to use immediately.
In fact, we have an Advanced Caching Mechanism that automatically:
- Speeds up response times by serving cached content to visitors;
- Detects changes to your website;
- Starts building new cache files in the background and serves them to visitors when they’re ready.
Cache Invalidation and Cache Warmup both play a big part in that mechanism.
But does this mean that your page speed drops whenever a change is made since the old cache has to be purged in order to be replaced with the new snapshot?
Actually, no! Our Smart Cache Invalidation feature allows the cache to be updated in the background while serving the previously cached version of the page to real-time visitors.
Again, this process happens automatically whenever an update is detected and usually takes just seconds to complete. As a result, you never serve unoptimized (slow) pages to your website’s visitors.
