Show Me the Cache! Server Cache vs Browser Cache

Share this post

If you’ve ever been part of a web development or web design project, odds are you are quite familiar with the question, “Have you cleared your cache?” Often times when changes are made on a website, they don’t always show up due to the page being “cached”. Let’s dig a little deeper into what a cache is, the different types, as well as how you can ensure that you’re seeing the freshest content the web page has to offer.

What is a Cache (pronounced “KASH”)?

Unlike monetary cash, a cache stores temporary data in order to deliver information faster.

Not to be confused with the type of cash you use to buy things, a cache is where temporary data is stored in order to deliver the information quicker the next time it is requested. Utilizing a cache on a website helps increase performance and ultimately, delivers a better user experience. Although there are lots of benefits to this, there are two common ways that this can present an issue for a user; on the web server’s side, and within the user’s browser.

Types of Cache: Server Cache vs. Browser Cache

Server Cache 

Server cache is often the culprit of confusion and frustration when it comes to performing website updates. Clients often request a change, we make them, tell them it’s fixed, only for them to tell us it’s not fixed. Why’d this happen? (Hint:It’s not because we didn’t fix it!) The answer is server cache.

In many cases, if you wait patiently (in some cases, it could be a few days) the changes will eventually show up as the server will clear out the cached information during regular intervals. We understand that not everyone is that patient, so to review the change immediately, within the backend of most CMS’s (content management systems), there is the ability to flush, or clear the cache. This notifies the server and requests the latest files, in which you should be able to view the changes made.

As a web development company, we know this is a common issue and as part of our protocol, we try to do this ALMOST every time we have something being reviewed. However, this does not necessarily mean the end user can always see the changes, which leads us into browser cache.

Browser Cache

Browser cache is similar, with the exception that the data is often stored on your hard drive. The benefit of this is that the information doesn’t need to be requested or downloaded every time you visit a page, which helps with load time.

Browser Cache

Favicons, or the very small icon displayed on browser tabs, are notorious for not updating within the browser for extended periods of time. Although a simple refresh of the page helps solve some of the minor issues, often times it will not solve the issues if a major update was done that involves styling, images etc. Doing a “hard refresh” will help solve these issues. Below you will find how to refresh your cache on the most commonly used browsers. 

How to Refresh Your Cache

On MAC:

Chrome: Hold down Shift and press reload.

Firefox: Hold down Shift and press refresh.

On Windows/Linux:

Chrome: Hold down Ctrl and click the Reload button.

Firefox: Hold down Ctrl and Shift and then press R.

IE: Hold the Ctrl key and click the Refresh button.

On Android:

Chrome:

  1. In Chrome, tap the menu button in the upper right hand (three vertical dots).
  2. Go to Settings > Privacy.
  3. Click “Clear Browsing Data”.
  4. In pop up, check the boxes next to the items you want to clear (including your cache) and click “Clear”.

On iPhone/iPad:

Safari:

  1. Go to Settings > Safari and scroll to bottom of options.
  2. Click “Clear History and Website Data”.*

* If you do not want to clear your History, click “Advanced” > “Website Data” > and “Remove All Website Data”.

Keep Calm, Clear Cache (KCCC)

Now that you know how to clear your cache on your end, it’s important to make a habit of doing it often. By doing so, it guarantees that you are seeing the newest and freshest content. The best part of it all is that it can usually be done in less than a minute!

Related Posts

Config Sync Overview

Config Sync Overview

When Drupal 8 was released, it came with Configuration Syncing functionality. This has been a staple ever since for Drupal 9, Drupal 10, and beyond. Configuration Syncing was a game changer and one of my favorite features in Drupal Core.The days before config sync...