To start, let’s look at what a website cache is and why it exists.
What It Is: When we browse the Internet, we often times visit a website and pages within a website multiple times. When we visit a page for the first time, it downloads the pieces that make up that page, such as images and page styles, and stores them in a temporary cache on the visitor’s computer.
Why It’s Used: Website caching is very important because it prevents redundant downloading of website page elements. When you visit a page for a second time, your browser doesn’t need to re-download all of the elements that make up the page because they are stored in your local cache. This reduces bandwidth for both the web server and the visitor and allows the page to load faster since it can load an image from your local computer much faster than it can download the image from a far-away server.
The Dark Side of Web Caching
So what could go wrong with this? The problem occurs when a website has changed, but the visitor’s browser (Chrome, Firefox, etc) is still loading old content from a previous visit to that page. Your browser doesn’t always know if something has changed on a website from a previous visit. This most often happens with style (CSS) changes:
Styles tell the browser how to display the elements on a page. This includes font type and styles (bold, size, kerning, etc), margin and padding around elements, the positioning of elements, and more. When these styles are changed on the web page, they almost never update instantly for the visitor. The visitor will see the change when one of the following happens, in order by most likely to occur:
- The files in the visitor’s website cache have expired, and the browser then downloads the latest version upon visiting that webpage again.
- The visitor’s website cache has become full and cycles all of the way through the cache replacing old content with new content downloaded from subsequent browsing, thus replacing the files that make up websites previously visited, forcing the browser to download the latest version of those files when that webpage is visited again.
- The visitor reloads or refreshes the webpage while viewing it, sometimes requiring a hard refresh, which forces the browser to re-examine the cached files or download new versions. A soft refresh can be done by clicking the refresh button in the browser, or by pressing F5 (Windows). A hard refresh can be performed by pressing Ctrl + F5 (Windows) or Command + R (Mac).
- The visitor manually clears their browser’s cache, thus forcing the browser to download the latest version on the next visit. This can be done by pressing CTRL-Shift-Delete (Windows) or Command-Shift-Delete (Mac).
- The visitor opens private browsing (incognito) window and visits the website. When you use a private browsing / incognito window, it won’t utilize your cache from your standard browsing window, and it also empties the cache from your private browsing window after you close it.
Invulnerabilities
Generally speaking, new content or updated text content is not subject to any adverse effects of caching. New content must be pulled from the web server, therefore it’s always the latest version, and text content isn’t usually stored in a cache because it’s low in file size and very fast for a browser to acquire that data.
Conclusion
Caching is a thorn in the side of any website developer because we are constantly reminding our clients to refresh or clear their cache to see the changes we make. To date, there is no wide-spread, industry standard solution to this problem. Working around this almost always involves action on the side of the visitor and leaves website developers virtually helpless in preventing this from occurring.