Tied Up

"Did you try clearing your cache?"

Caching: What it is, why we need it and problems it may cause

Intro: What is Caching?

Has anyone ever told you that you needed to clear your cache? If they did and you had no idea what they were talking about, you are not alone.

Simply put, caching is when web pages are saved by either your web server or browser so that when you request the information it can be accessed right away, without delay.

Why is it important?

Caching’s main benefit is efficiency and speed. Web servers doing less work to deliver content to the end user more quickly, or web browsers using information they already have (and not even bothering to ask the server) greatly improves performance and makes for happy users.

Many websites you visit use a CMS to produce the web pages you are requesting. This means the web server must read from the database the information that needs to go on the page, combine that information with the HTML and send it to the browser. Database access takes time and slows down the server. What caching does is save that assembled page after the first request, so that on subsequent requests it just returns the saved HTML from the prior request and does not have to query the database again.

When a site needs to perform complex, time-consuming calculations or has to do a lot of database queries the savings are even more impressive. Instead of doing the same calculations over and over for each request, the previously calculated results are simply returned.

Caching on the Server

Most web server software allows a developer to set up and configure caching. Microsoft’s IIS (Internet Information Server) automatically caches static content (HTML, style sheets, JavaScript and images that do not change from one request to the next). IIS will also detect changes in updated files and flush the cache (deletes the existing cache and replaces with results from a new request) as required. Web servers can also use HTTP Headers to tell your browser which files to cache and for how long.

Developers can use caching techniques when writing code. Who better than the developer knows which data can be reused and when it needs to be refreshed? This ensures that caching efficiencies are built in to the website, whether or not the server or browser are configured to use caching.

Caching may also be controlled through the CMS. Most if not all CMSs have built in caching mechanisms (or a plugin that can be installed and configured) to control how caching is handled. When content is saved in the program, the cache is refreshed for the next visitor.

Caching in your Browser

The first time you go to a site, your browser must download all of the code and assets that make up the page you are trying to view. This includes HTML, style sheets, JavaScript and images, and all may be cached by your browser. This first page usually takes longer to load, as all of the files are being downloaded over the Internet. The next page you go to seems to load a lot faster because instead of downloading all of the files again from the web server, it uses the local copies on your computer that were previously downloaded.

Frequently, customers ask us to make changes to their website. We implement the changes and push them live, but when the client tries to view the changes they still see the old site. This is usually followed by an email or phone call letting us know that they can’t see the changes. The reason for this is the browser caching files locally on their computer, and is the main downside to caching. If the server told the browser to cache a file for 5 minutes, but the files were only download 2 minutes ago, a new copy won’t be downloaded for another 3 minutes.

A simple page reload (F5) may show them the new content, but sometimes the changes still don’t show. Files such as style sheets and JavaScript are usually more difficult to clear and may require a “hard” reload, which will tell the browser to get all of the files from the web server, and not use any of the locally saved files.

Caching by the browser lasts a certain amount of time, so eventually users who were caching the site will see the new changes. Users who didn’t have the site cached (maybe they hadn’t been to the site in a while) will see the changes immediately.

Each browser handles caching differently, and knowing how to clear your cache will help you get the latest content when your browser acts stubbornly and doesn’t want to let go of cached files. Just remember that clearing your browser cache will only affect your local files; it will not do anything to clear server side caching.

How to clear web browser cache

Pressing F5 or Ctrl+R will reload the page, but you may not get latest files. You may need to press
Ctrl+Shift+R or Shift+F5 to do a hard reload. This usually gets the latest files, but not if you’re using Internet Explorer (IE). To be sure you are getting all of the latest files, you should clear your cache completely. This can be accomplished by pressing Ctrl+Shift+Delete. Each browser has its own interface for clearing your cache. Firefox and Chrome present a checkbox that clearly relates to clearing your cache, while IE refers to “Temporary Internet Files and website files”. Just be careful which checkboxes you click, since you could lose all of your browsing history, form data and saved passwords by checking the wrong boxes.

Summary

Caching is extremely useful. By accessing content saved locally, tremendous gains in efficiency can be realized. Developers need to understand the downside and inform clients to set expectations and teach them how to refresh their cache so they see the latest and greatest content.

Need expert development help you can trust? We’ve got the best in town. Contact us to lend a hand with your next project.