Improving website performance with caching

In this video tutorial, we will define what caching is and explore six common types of caching and how to use the W3 Total Cache plugin.

Learning outcomes

1. Explain caching.
2. Differentiate between six of the most common types of caching.
3. Use the W3 Total Cache plugin.

Comprehension questions

1. What is caching, and how does it improve website performance?
2. Why use a cache plugin?

Transcript

Hi, and welcome to Learn WordPress. In this session, we will take a closer look at caching and how you can use it to your advantage. Caching is a technique used to improve the performance of websites. It involves storing frequently accessed data in a cache, which can be quickly retrieved when needed, rather than having to retrieve it from the server every time a user visits the website.

Caching is like having a personal bookshelf for frequently used files and data. When a user visits a cached website, the browser checks the cache first for required files. If found, the website loads faster. It lessens the server’s burden by serving cached files instead of generating them repeatedly. Ultimately, caching enhances user experience by providing faster loading times and smoother website navigation.

Adding a plugin is probably one of the most simple ways to optimize caching on your WordPress website. Cache plugins simplify implementation, optimize performance, offer advanced techniques, and include cache management features for efficient and targeted caching on your website. Let’s briefly look at six of the most common caching you will come across.

Number one – Page caching. Page caching saves a fully prepared version of a web page so that when somebody visits the website, it can be quickly displayed without needing to be created from scratch.

Number two – Browser caching. When you visit a website, your browser saves certain files, so the next time you visit that site, your browser can use the stored files instead of downloading them again. This helps to load the website faster since the browser doesn’t have to fetch all the files from the server every time.

Number three – Server caching. Server caching involves storing commonly accessed website data. When a user requests that data, the server can quickly retrieve it from the cache instead of generating it again.

Number four – CDN caching. Content delivery networks store copies of website files on servers located in different parts of the world. When a user visits the website, the files are loaded from the nearest server, reducing the time it takes for the content to reach them.

Number five is Object caching. Object cache is used to save on trips to the database. It stores all the frequently used website elements in memory for quicker access, making the site load faster and reducing server work.

Lastly, number six – Database caching. Database caching focuses on caching the raw data obtained from database queries, while object caching caches processed and ready-to-use elements of the website.

Some plugins to explore are W3 Total Cache, WP Fastest Cache and LightSpeed Cache, but there are many others available in the plugins directory. In this example today, we will install and activate the W3 Total Cache plugin and then enable some of the most important settings.

Let’s go to plugins, click on add new, and search caching. Iin this case, we will click on install now next to W3 Total Cache and then activate. Once activated, we can make our way to settings. When you get here, you will notice at the top it says welcome to the W3 Total Cache setup guide. They provide you with a guide to follow, but you can also click on skip this setup guide if you want to; otherwise, you can click on Next and go through all of these types of cache one by one.

Let’s go ahead and test the page cache. We are after the fastest time. As you will notice, they have also recommended the disk enhanced, which is actually the fastest time. Then we can click on Next and select Test database cache. At the bottom below recommended, it actually says to leave this feature disabled as the server database engine may be faster than using disk caching.

Let’s move along and test object cache. Here we will notice that the fastest time is 1.85, so we will select that and click Next, test the browser cache, and ensure that it is enabled. Then it also says select lazy load, and we will discuss that in a second.

When the setup is done, we can visit general settings to learn more about extra settings and features. So let’s make our way to general settings. Let’s take a closer look at some general settings. First up is page cache. The first thing we want to do is to ensure that this is enabled. Adding page cache can improve performance and reduce server load. Please note some hosts also provide page caching.

Next, we are going to look at minify or minification. It reduces load time by decreasing the size and number of CSS and JS files. And it automatically removes unnecessary data from CSS, JS, feed page, and post HTML. We can therefore go ahead and enable Minify. I’ve read through the documentation, so I will go ahead and say I understand the risks. Leaving minify mode on auto will suffice.

Then we can scroll down to opcode cache. Opcode cache is available to Pro version users and allows you to store compiled PHP code.

Now we move on to database cache and object cache. Let’s first talk about database cache. As you know, it was recommended during this setup that it might be better to keep this disabled on this specific website. It also states that it is best used if object caching is not possible. Object cache is possible, so we have therefore enabled this feature as it further reduces execution time for common operations. But please note database cache and object cache are not recommended when using Shared Server Hosting.

Up next, we will ensure that browser cache is enabled, as it reduces server load and decreases response time by using the cache available in a visitor’s web browser. As mentioned, CDN caching is also important. To implement this, you need a CDN provider. So make sure you sign up for providers such as StackPath, CloudFlare, or others.

Let’s move on to the Google Page Speed section. Here you can connect to the Page Speed Insights API, which lets you analyze the performance of your website. If you authorize this, it does require you to connect your Gmail account.

Next, let’s talk about lazy load images. When lazy load images is selected, images and other media elements only load when the user reaches that section, which will reduce website load time. You can also consider disabling the three options below.

When you are in your dashboard, you can use your left sidebar to fine-tune more specific settings for different cache types. Lastly, it is worth mentioning that sometimes the cache won’t realize you have made changes or updated your site, and instead of loading the new version of your site, it will load the old version. You might then consider clearing your cache to ensure the newest version of your site loads as a form of troubleshooting. You will find options to clear the cache at the top of your dashboard.

I trust you now understand caching better and that you will find the right plugin that works for you. It is also worth mentioning that enabling caching after building your site is best. Visit Learn WordPress for more tutorials and training material.