Caching - What does it really mean?

Picture your earliest memory of your childhood. Now, recall that memory again. It was much faster to recall that memory the second time, right? The reason it is quicker the second time is that the brain instantly saves that data in recent memories, therefore, it is much more efficient to bring up that memory the second time.

Caching (pronounced cash-ing) functions similarly. In essence, caching stores content in the short term in a spot that the user can pull it up quickly. There are a variety of caching methods, but browser caching and page caching are the most popular ones.

WHAT IS BROWSER CACHING? WHY IS IT USEFUL?

With browser caching, portions of the website that don't change often known as 'static assets' or shared page elements, which include images, JavaScript, CSS, etc. are downloaded and made accessible to the user. The browser can now access this info from the stored spot instead of having to go back to the server.

When you first visit a website, a request is sent by the browser to the remote server that is hosting the site. The server will then return the assets of the site. It will return the HTML first since it is the outline of the website. Following that will be other requests for static assets.

The browser will figure out what to cache and for how long after everything is downloaded. Certain assets might last only a couple of days while others might be kept for a year.

BROWSER CACHING ADVANTAGES:

1. Optimisation And Responsiveness

There are a number of areas on the network path from the source to the user that the content could be cached. Once the cached content is nearer to the user, it loads much faster, which reduces network traffic. Bounce rates are also minimised and this makes the webpage appear to be operating much faster.

2. Lower Network Costs

Since there is less network activity, this, in turn, reduces the network costs.

3. Guaranteeing Availability

User experience is paramount in the online world, therefore, caching in scenarios where there might be a temporary interruption on the network or failure on the servers, the user still has access to the content and the website remains sturdy.

WHAT IS PAGE CACHING? WHY IS IT USEFUL?  

The server sends the user pre-rendered front-end code after the webpage loads and this is referred to as page caching. This way a new copy of the page won't have to be sent each time.

By doing this, it eliminated the loading operation of the webpage's backend code, like the PHP, at every visit. As a result, this dramatically improves the loading time of the webpage.

MySQL queries are the leading factors in slowing down the loading of most websites. In certain instances, particularly on e-commerce webpages, the page might have to send numerous MySQL queries so that the page could be displayed properly. This bogs down the hardware on the server, which makes the page load slower, particularly on servers that are shared or on lower power.

When a page cache is enabled, there isn't a need for the server to run backend/DB queries for the page to be loaded properly. It pulls from short term memory storage, eliminating processing time and speeding up loading times, which makes the site function much faster.

The downside is that all sites don't have page caches. If you have dynamic content on your website, such as a backend PHP code that triggers a script to display random images 20% of the time the page loads. The page cache only stores one image initially, therefore, page cache won't work in this scenario. Therefore, before enabling page cache, it is essential to review and test the code for every site.

CACHING DISADVANTAGES

A major disadvantage of caching, especially in website development, is that it could produce old info to visitors.

For instance, say the content of a page was updated, then loaded, but you still get the old version of that webpage. The new content isn't being displayed. The caching system has to be notified that an update to your cache was done. This is the only way for the new content to be seen.

Suppose you made caching available on your website, but you made some changes to an image on your homepage the following day. However, the old image is still being displayed.  

Your computer has stored the cache of the old image on its hard drive, but it will not request a new image until the file for the cache expires.

The good news is that this doesn't happen too often since the server is aware of which assets were updated and the ones that have to be updated. But, if you keep seeing this specific error on a website, this is probably the cause.

THE FIX
Clearing your cache should fix this problem. There is a clear cache option on most browsers and this will instantly clear files from your cache. Say you are using the Google Chrome browser:

1. At the top of the screen, right side, select 'more' button

2. Select 'more tools'

3. Next, 'clear browsing data'

Give this a try by visiting a webpage you use often. Take note of the loading time. Now, clear the cache and then go back to the website and note the longer loading time. If you are having problems with a specific website, there is the option to clear the cache only for that specific site, while the other websites remain as is. This way, your browsing stays quick and efficient.

Another option is to use the W3 cache plugin to clear the cache. Do this by:

1. Access the dashboard in your WordPress

2. Click 'Performance' then select the 'Dashboard' option

3. Go to the top of the page and click the empty all caches button

Do you want to resolve caching and other website issues? Contact me for a free quote.

Russ Clow

Freelance Website Designer & Developer

         

I've been designing and developing websites for a very long time. In that time, I've learnt many things - and this article is written to help share that knowledge with others. Everything within this article is written based on my experience, but is my own professional view.

If you would like to tap into my knowledge further, please contact me for a free, no obligation quote.

Need a quote?  Contact me