WordPress Caching: Understand the whole set and application on your website »Compa Marketing

In this post, I hope to shed some light on those misconceptions and provide a bit of clarity about the mine that is WordPress caching. Hopefully, by the end of this post, you will have a better understanding of how different caching layers play a role in speeding up WordPress.

Why is caching important?

Before we dive into the different storage mechanisms, it's essential to understand the benefits of storage. Caching plays two main roles:

It improves application performance. For WordPress sites, this means your site loads faster.
It increases application throughput. That is, your site can handle more traffic.

Moreover, caching can increase both application performance and throughput without increasing storage costs. This is because you need less system resources (CPU & memory) to host a website that has been stored correctly. It is truly a mutually beneficial strategy (when done correctly).

How pages cached pages are served

I think it's easiest to understand the hosting process by viewing how a page is served.

Suppose you own a blog with caching enabled. The first time someone visits your homepage, they receive the page in the usual way: The request is received, processed on the server, and the displayed result page is converted into an HTML file and sent to the browser. visitor's browsing.

Because caching is enabled, the server that hosts this HTML file - usually in ‘random access memory’ (or RAM), is extremely fast. The next time you or anyone else looks at the homepage, the server doesn't need to process and convert it to HTML. Instead, it simply sends the prepared HTML file to the browser.

It should also be noted that, by implementing caching, you not only make your site faster, you also make it work better - and equip it to bear the burden of any traffic. Any sudden counter is more effective.

Types of buffers

Broadly speaking, there are two types of caches - server and browser. Browser caching is done on the client side (user), while the server cache is done (not surprisingly) on the server. Let's look at the difference between the two.

Caching in WordPress

Caching Layer

WordPress is a database based CMS, which means that there are a lot of moving parts when processing an incoming request. The out-of-stream WordPress must query the database and display the page before it can be sent to the user. This happens on every single incoming request, which is very inefficient if the page content is not changed. A typical request would look like this:

As a general rule, the more moving parts involved in request processing, the more users have to wait for feedback and the more system resources are used. To counter this, caching is usually done in layers, with each class sitting in front of a moving part. Three outstanding classes in WordPress are usually divided into:

Browser Caching
Page Caching
Object Caching

Let the scuba dive into each class. We will work from the outside, which takes us to browser caching.

Browser caching

While browser caching doesn't necessarily support application response time or throughput (at least in WordPress areas), this is the most important class when it comes to reducing the amount of data. Data must be sent from server to browser. This can make your site feel much faster to respond because static assets like CSS, JS and images appear much faster if they are cached by the browser.

When it comes to understanding your browser's cache, the network tabs in your browser, the developer tool is your friend. Let's take a look at browser buffers in practice, by loading the SpinupWP page as an example (because it's shiny and new). The first page won won has any of the properties cached by the browser (I turned on Disable cache to forge initial page loading).

Second, the value to be transferred must always be lower than the total resource, even if this is the first time the page is loaded by the browser (or ‘Disable cache enabled)for two reasons:

The property is cached in the browser cache.
Assets like HTML, CSS, and JS must be compressed by the server before being transferred to the browser. They then unzipped the browser before showing it to the user.

Therefore, if the browser cache is configured correctly, subsequent page loads will transfer less data. You can see this for yourself when we reload the page.

Page Caching

Page caching will give you the most benefit by improving both the response time and application throughput in WordPress. The page buffer basically turns WordPress (database-based CMS) into a static HTML page by taking both PHP and MySQL out of the equation when processing a request.

To demonstrate the importance of possible page caching, I will standardize a clean WordPress 5.2.2 installation using ApacheBench. In these tests, I used SpinupWP to provide 8 GB, 4 vCPUs DigitalOcean Dropplet tailored to host WordPress websites. Unnoticed results are for WordPress with no cache configuration (except for PHP OPcache, which uses the default values of PHP 7.3).

Opject Cache

As mentioned before, not all pages can be cached. This is especially true for e-commerce and membership sites, which often display personalized content. The same is true for the WordPress admin area. If such dynamic pages are cached, users will see personalized content unrelated to them.

WordPress has built-in object caching, which allows data such as database queries to be stored in memory. This is how many calls to functions like get_posts refer to a database query. However, the object's buffer does not exist by default (meaning it does not live out of order). Fortunately, WordPress can be integrated with a persistent data repository like Redis, which is important for dynamic page replication. The object buffer between PHP and the database speeds up PHP execution time and reduces the database load by storing queries in memory. You can see the impact of object buffers by installing the Query Tracker plugin. Load the WooC Commerce shopping cart page without enabling object caching in 32 database queries: