Advertisement
Scaling & Caching

WordPress Caching Plugins

by

It is important to have a fast website in terms of both user experience and search results. In this article we will find out what caching is, how it can help to speed things up and two popular caching plugins for WordPress.


What Is Caching?

Caching is a kind of storing data for future uses. We are talking about caching data related to web sites, so these can be HTML, JS and CSS code, but images, fonts, and Flash files are also cacheable.

There are two reasons why we should use caching: to reduce latency (gain speed) and to reduce network traffic (amount of data loaded).

The speed of the website can be a critical factor for commercial websites like webshops or search engines like Google.

Cache is generally used both on the client side (browser) and on the server side.

On the web usually every content component has an expiration date and time, that dictates how long the application uses the old version. When this time expires the server and client will use a new version which has to be downloaded again.


Caching Strategy Tip

Statistics1, pic by Peter Forret, flickr

A good strategy for caching is to identify the most popular and / or largest sized data and apply caching to that first. After this you can go further and find more components to cache.


Disabling Browser Cache in HTML

With this code placed in the top of the head section you can turn off client side caching.

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />

Disabling Server Side Cache in PHP

This little two liner code goes to the uppermost part of a PHP file.

<?php
	header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
	header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
?>

Using a CDN

Statistics2, pic by mackarus, flickr

CDN stands for Content Delivery Network. Usually it consists of multiple servers in multiple geographical locations to handle content used by websites. It can be used to speed up the loading of external files like CSS, JS and images. There are both free and paid options if you want to use this kind of service.

The physical location of the CDN servers is very important. If your website is in Europe and the CDN you are using has only servers in Europe but an American user requests a page then it will be just as slow as if you didn't use CDN.

Two popular free CDNs are Cloudflare and Coral. On the paid side Amazon Cloudfront is probably the biggest and most well known service, which has an on-demand pricing and a traffic calculator.


What Will Be Cached?

It depends on your plugin what will be cached. Some plugins offer only caching for back end (PHP, MySQL) and others can handle frontend as well (HTML, CSS, JS, images, fonts, etc.). Read the description of the plugin to learn which parts of the
webpage will be handled.


Static and Dynamic Content

Static content (front end) is usually regular files (CSS, JS, images, Flash files, fonts, etc.) on the server and handled using the simplest methods available to the web server. Dynamic content (back end) is always generated (generally from a database, eg. articles in the case of a blog) at the time of request to the page.


Web Server Support of Caching Components

If we talk about Apache, there are two methods which can handle HTTP based caching: one is mod_cache and the other one is mode_file_cache.

You can also find the Apache guide useful to understand how it handles caching and requests as well.


Why Use These Two Plugins?

These two tools were downloaded more than 4 million times combined and have a healthy reputation as well. While WP Super Cache is a simpler plugin in terms of how many things you can set, the other one is like a monster, because it has got a couple of dozen features per category.


WP Super Cache

WP Super Cache

The description: "Very fast caching plugin for WordPress."

This plugin basically works as a page cache which means that it creates static HTML files. These files are stored and replaced again when the given time expires. WP Super Cache is based upon a plugin originally by Ricardo Galli Granada. The usage of the plugin is very simple: install, then go to the options page and set the desired cache time. It is important to know that dynamic content eg. within the sidebar, will be refreshed only when the cached pages are refreshed.


W3 Total Cache

W3 Total Cache

The description: "The highest rated and most complete WordPress performance plugin. Dramatically improve the speed and user experience of your site. Add browser, page, object and database caching as well as minify and content delivery network (CDN) to WordPress."

This tool has a broad range of settings for example: page caching, minifying, database cache, object cache, browser cache, CDN, Varnish, performance and security by Cloudflare. It even features debug mode for several settings and the user can export and import configuration files.

Several benefits of using this plugin according to the developers:

  • improved search engine ranking
  • increased visitor time on site
  • optimized progressive render
  • fewer HTTP transactions
  • reduced document load time
  • bandwidth savings

Comparison

WP Super Cache W3 Total Cache
Freeware Yes Yes
Plugin Version 1.1 0.9.2.4
WordPress Version 3.0+ 2.8+
Downloads 3.4 million+ 1.2 million+
Average Rating 4 4.5
Works Without Modifying Files Yes Yes
CDN Support Yes Yes
Page Cache Yes Yes
Tested Server Support
  • Apache
  • Apache 1.3+
  • Nginx 0.7+
  • IIS 5+
  • Litespeed 4.0.2+
Plugin Homepage by Donncha O Caoimh by W3 Edge
Support Forum WP Super Cache W3 Total Cache
FAQ Yes Yes
Number of Settings Moderate Very Many
Number of Developers One Several

Which Plugin to Choose?

Both plugins offer several usable categories of caching. The user interface of W3 Total Cache looks nicer than WP Super Cache, but at the same time the options can be a bit overwhelming there. It is a good idea to install both tools, check all the options and decide what you need, but all in all I would stick to WP Super Cache to spend less time fiddling.

Related Posts
  • Code
    WordPress
    An Introduction To Deploying WordPress with MinaImage400
    As a PHP application, WordPress is usually deployed by a very old method: uploading files via FTP. We have some deployment tools, but they often requires some type of Ruby skill. For example, one popular, powerful tool is Capistrano, but it's also very heavy with many Ruby/Rails related features. I also think that it's little bit tricky to install Capistrano for a PHP developer without any Ruby knowledge. So what options do we have as WordPress developers? In this tutorial, I will introduce you Mina: A small, light tool aims to fast deployment and server automation.Read More…
  • Code
    Theme Development
    Creating a WordPress Theme From Static HTML: Creating Template FilesCreating wordpress theme from html 400
    In the first part of this series, I showed you how to prepare your HTML and CSS files for WordPress, ensuring the structure would work, the code was valid and that the correct classes were being used. In this tutorial you'll learn how to take your index.html file and split it up into a set of template files for use by WordPress.Read More…
  • Code
    Theme Development
    Creating a WordPress Theme From Static HTML: Preparing the MarkupCreating wordpress theme from html 400
    Last year I did a small (and admittedly very un-scientific) survey among other WordPress developers. What I wanted to know was this: When they built their first WordPress theme, how did they do it? Did they hack an existing theme or did they start with their own static HTML and turn it into a theme? The majority of people I spoke to used the second approach - they were all experienced frontend developers who had built sites using HTML and CSS, and found it easiest to take their existing HTML files and convert them to a theme. Two of the people I spoke to were lecturers or teachers, and told me that this is the approach they use with students. So in this series I'm going to show you how to do just that.Read More…
  • Code
    Plugins
    Displaying Information of a WordPress.org Plugin on Your WebsiteWordpressdotorg plugin api border 400
    In the first part of this article, we discussed how to use built-in functions to communicate with WordPress.org and retrieve plugin details. In this tutorial we will put the theory in action to create a simple plugin which will allow us to display details of any plugin hosted on WordPress.org on our WordPress website using shortcodes.Read More…
  • Web Design
    CMS
    Organizing Ghost Theme Files and FoldersGhost files retina
    This is the second part of our Ghost theme design tutorial series. Everything from here assumes you have a foundational understanding of Ghost. If not, before continuing please take the time to read Understanding Ghost: Stages of Design).Read More…
  • Code
    Plugins
    Communicating With the WordPress.org Plugin APIWordpressdotorg plugin api border 400
    Over the last few weeks I have been wondering on how to possibly pull data about my plugins hosted on WordPress.org and display it on my website. The first thing that came to mind was "Web Scrapping" but quite frankly this is a lot of work, feels like going back in time, and is not something a good web citizen should do. In some cases, it could be illegal.Read More…