Tags – ,

What is Website Caching and Why is it so Important?

Website caching is one of the most beneficial technologies available. In short, it makes websites extremely fast, which leads to better SEO scores and increased user satisfaction — not to mention better conversions and therefore increased income if you’re selling products or services online.

In this article, I’ll tell you all about website caching — covering what it is, why it’s so important, and how to go about implementing it with WordPress.

Let’s get started.

What Is Caching?

While the technology and precise details of caching can be pretty complex, the underlying idea is really very simple. Let me give an example.

If I ask you what the result of 5 x 3 is, you’ll know the answer is 15. You didn’t need to calculate it, you’ve done this multiplication so many times in your life that you no longer need to — you simply remember the result without having to do any mental processing. Well, that’s kind of how caching works.

Websites are generally viewed hundreds, thousands, or sometimes even millions of times per month. Normally, each time a browser requests a web page, the server has to do a bunch of complex (and time consuming) calculations. It retrieves the latest posts, generates the header and footer, finds your site’s sidebar widgets, and so on. However, in many cases, the result of all these calculations will be exactly the same. Wouldn’t it be great, then, if we could simply make the server remember the final result, instead of processing each request separately? This’s exactly what caching does!

How Cached Pages Are Served

I think it’s easiest to understand the caching process by looking at how a page is served. Let’s say you own a blog with caching enabled. The first time someone visits your homepage they receive the page in the normal way: The request is received, processed on the server, and the resulting web page to be shown is turned into an HTML file and sent to the visitor’s web browser.

Since caching is turned on, the server stores this HTML file — usually within its ‘random access memory’ (or RAM), which is extremely fast. The next time you, or anyone else, views the homepage, the server doesn’t need to do the processing and conversion to HTML. Instead, it simply sends the already prepared HTML file to the browser.

But What if My Content Changes?

I know what you’re thinking: That all sounds great, but what if you have caching turned on and then publish a new post? Won’t the new post be outside of the cache and therefore invisible to site visitors? Well, all properly set up caching systems can deal with such scenarios. A caching system doesn’t just consist of the mechanism to store prepared HTML files, it also has a way to empty the cache (and then regenerate it) when specific conditions (such as the publishing of new content) are met.

A cache configured for WordPress would delete the cached version of the homepage and archive pages when a single post was published. It would leave all other pages — such as the about page and other posts — untouched, since those would not be changed.

Is Caching Really Effective?

A well-coded website may already load in as little as two seconds. (Note: The load speed of a website is something you can easily test for yourself using a free service such as GTMetrix.) Isn’t that fast enough? Is caching really worth it? The answer is a resounding yes. By using both browser and server caching — we’ll look at each in detail in a moment — you can still shave a lot off load times, and, when it comes to load speed, it pays to make things a fast as possible!

Also worth keeping in mind is that, by implementing caching, you aren’t just making your website faster, you’re also making it perform better — and equipping it to bear the burden of any sudden traffic spikes more efficiently.

Just how effective is caching? According to a recent study by YUI, browser caching can increase speeds by as much as 300%!

Types of Caching

Broadly speaking, there are two types of caches — server and browser. Browser caching is done on the client (user) side, while server caching is (unsurprisingly) done on the server. Let’s look at the differences between the two.

Browser Caching

When you visit a website, you don’t just need to retrieve the content of the page you’re seeing — you also need a bunch of resources such as Javascript files, stylesheets, fonts and so on, which your browser downloads in addition to the content of the page.

Browser caching allows your browser to store these files for a while, so it doesn’t need to retrieve them every time you visit the site.

The first time you visit this site (WinningWP.com), for example, you’ll receive a bunch of resources that your browser will immediately cache. This first will likely take a few seconds to completely download, but the next time you visit you’ll notice a significant decrease in load time (as much as a second or more, in fact).

Server Caching

I’ve already talked about the mechanisms behind server caching: Instead of processing every request, the server takes the results of these requests and stores them. It then serves these saved results instead — making everything much faster.

You may have come across the terms ‘object cache’ and ‘full page cache’. These are both server caching methods — the full page cache is what we’ve been talking about so far.

Object caches store only bits and pieces of data, as opposed to a full page. This can be useful within your code, and when storing the result of complex operations such as the generation of a navigation menu.

Caching in WordPress

There are three things you need to know about caching in WordPress: Writing efficient code, using caching plugins and using your host’s built-in cache.

Using WordPress Caching Plugins

The most important rule of all, which I cannot stress enough, is: never ever, ever, ever (ever) use more than one caching plugin. This will not make your site faster; it’ll likely make your site a lot slower, and break it in the process.

Always use a single caching plugin. When configured correctly, it’ll help speed up your site quite a lot. The best caching plugins are WP Rocket (read our review), W3 Total Cache and WP Super Cache.

Using Your Host’s Caching

This one applies to websites that run on managed WordPress hosting environments. I can highly recommend WPEngine, Flywheel and Kinsta, all of which have excellent caching mechanisms (and other services) that make them worthwhile.

Caching systems used by these hosting companies are run at a much lower level than WordPress plugins, which means they’re far more effective. What’s more, they’re also finely tuned specifically to work with WordPress and the hosting environment being used, which increases their utility even further.

If you’re using a managed WordPress host, I recommend not using any caching plugin at all. In fact, many such hosts will even disallow the use of certain caching plugins because of the fact that they’ll likely interfere with the specific caching systems they’re already implementing.

Writing Efficient Code

This one is for the coders among you. We won’t go into the nitty-gritty here, but the first thing you should be aware of as a coder is how WordPress works internally.

For example, if you’re getting meta data for a post and you call get_post_meta( $post_id, 'co-author', true ); WordPress actually retrieves all metadata for that post. So having 50 separate get_post_meta() calls to retrieve one post’s data is not wasteful.

The next thing you should look into is how to use transients in WordPress properly. Transients are a kind of object caching solution with an expiration date. You can use them to cache your footer or header, which doesn’t really change over time, except in very specific circumstances — at which point you simply empty the cache.

Conclusion

Caching is a technology that increases the speed of your website without sacrificing anything in the process. When used correctly, it’ll not only result in significantly faster load times, but also decrease the load on your server.

If you aren’t already caching your web pages, get to it!

To get started with caching in a more practical sense, take a look at the above-mentioned plugins and/or ask a managed WordPress hosting service about the effectiveness of the specific caching systems on offer.

Tweet about this on TwitterShare on FacebookGoogle+Share on LinkedInEmail to someone

By Daniel Pataki

Hello, my name is Daniel. I build plugins, themes and apps – then proceed to write or talk about them. I'm the editor for the WordPress section on Smashing Magazine and I write for a bunch of other online magazines. When not coding or writing you'll find me playing board games or running with my dog. Drop me a line on Twitter or visit my personal website.
Comments (policy)
More in Basics, Essentials
How to Install WordPress – The Famous WordPress 5-Minute Install Made Simple

WordPress likes to boast about its famous "five-minute install", claiming that it's so easy to install WordPress that anyone can get up and running with...

Close