With a vanilla Wordpress install, every page consists of a series of file loads and a handful of database calls. For example, a home page might include a set of images in a slider, your homepage content, a list of recent blog posts, a navigation menu and maybe a plugin or two. Even the simplest of pages requires some processing behind the scenes on the web server.
This can slow down the browsing experience for visitors, but can also cause strain on the web server hosting the website.
Caching essentially cuts these steps down. At its simplest, caching takes a snapshot of a page and serves that as a static page, rather than having to retrieve and build the same page on every request.
Why caching is important?
- A slow site puts visitors off; they are more likely to go elsewhere or just bounce back to where they came from.
- Search engines such as Google build loading times in to their algorithm: quicker sites appear higher on Google.
- Caching vastly decreases server load. Caching can save you money.
Types of caching
Caching can happen on the server-side and/or on the client-side.
Client-side caching is local to the website visitor. This means that the cache files are saved locally to the user's machine. Sometimes this is called 'browser optimisation'. Essentially images and static files (for instance javascript and css) are given 'expiry dates', and browsers told not to re-download those files under the expiry date is hit.
The Fixed.net knowledge base features a guide on setting up browser optimisation.
Server-side caching is where the caching occurs on the web server that generates the website. This can come in multiple forms:
- Page caching. The simplest method of persistent caching: a dynamically loaded page is saved as HTML and served directly, rather than re-generated on every load.
- Object Caching. There is an internal cache to WordPress (defined at wp-includes/cache.php) which is part of the Wordpress Core. During a single request, the output of complex database queries is saved in memory. However this is not persistent and is destroyed when a query finishes.
- Database Caching. Database caching stores the results of frequent queries to the database. This is useful for frequent queries, for example when building website navigation.
- Opcode Caching. PHP code requires compiling with each request. Opcode caching caches the compiled php code, saving server processing time and effort.
Caching plugins
There are hundreds of caching plugins, each of which do variations of the above. We'll cover three of them: W3TotalCache, WPSuperCache and WPRocket.
WP Super Cache
WP Super Cache is a static page caching plugin that generates HTML files of a dynamic website and saves them in the file system. These are stored in the supercache subdirectory of the WordPress cache directory, in a structure that replicates the WordPress permalinks; browsing that directory will essentially replicate a sitemap.
Mod Rewrite is used to present a visitor with this static HTML page rather than dynamically generated content. A website's .htaccess file is edited with new rules to bring this redirect override into effect. Ensure that 'Rewrite mode' is enabled however, as otherwise this plugin could actually add a performance overhead!
WP Super Cache is extremely easy to configure - simply install the plugin and click Enable Cache. Advanced options allow specific elements to be excluded, for instance shopping cart elements.
W3 Total Cache
W3TotalCache is a complicated piece of software with many features, but can be divided into three core areas:
- HTML, CSS and JavaScript optimisation and minifying.
- The caching of static resources on a site.
- Integrated support to mirror any static resources on a Content Delivery Network (CDN).
A copy of all static and minified pages, including search results and blog posts, are cached on the user's browser, on the server, and also mirrored to the CDN. To get the most out of W3TotalCache, configuration is required. It may not be compatible with some site features (and comes with a built in compatibility check). A common issue, for instance, is that styling breaks once cache is enabled. This can be fixed by simply disabling the HTML and CSS minifying and then clicking `Empty All Caches`.
W3TotalCache only modifies the wp-config.php file, and then puts cached files into the wp-content/cache subfolder.
Wp Rocket
WP Rocket is a paid addon, unlike WPSuperCache and W3TotalCache. Like SuperCache, it uses page caching to serve static HTML files rather than dynamically generating content. It also includes the following features:
- Lazyload. Loads only iframes and images when they are visible to the user.
- Database cleaner.
- Minification. Similiar to W3TotalCache, this reduces the size of JavaScript, HTML and CSS files, and is compatible with integrating a CDN.
Analysing Performance Impact
Like with any other product choice, the Caching plugin you choose is partially personal preference: price point, what the issue is and how much configuration you want to put into the setup. Supercache, W3TotalCache and WPRocket are all excellent plugins. Depending on your hosting provider, some may speed up your website more than others.
The Fixed.net monitoring tool can analyse website response times and speed. Use it before and after adding a caching plugin to assess the impact, and try different options to see which works best.
The Fixed.net can also help set up and optimise your WordPress website, as well as unlimited other website fixes, for a low monthly fee with no minimum commit.
