Using Cache to Turbo-Charge Your WordPress Site
Yona GidalevitzApril 07th, 20166 minute read
Yona is Codal’s Technical Writer. At Codal, he is responsible for content strategy, documentation, blogging, and editing. He works closely with Codal’s UX, development, marketing, and administrative teams to produce all manner of written content. In his free time, Yona is an avid guitarist, cook, and traveler.
When it comes to web content, the name of the game is speed. If I have to wait for my content, I'm not going to be happy. According to KISSmetrics, every second of delay during page load can result in a 7% reduction in conversions.
So how do sites rack up the seconds during page load? Well, for every new page or element on the site that must be loaded, the browser has to make a call to the server, then the server has to send the data to the browser—and this takes time.
If only there were a way to reduce the number of calls to the server…that's where caching comes into play.
What is Caching?
Put simply, a cache is a collection of items, stored for later use in a hidden place. In the context of computing—specifically web development—the "items" are pieces of your site, while the "hidden place" varies, depending on the type of cache.
Cache is used to reduce the time it takes to load a page. More explicitly, it is concerned with prefetching content and storing it in static cache files, which require significantly less time to load than it would take to send the same files from a server to a client upon request.
There are a number of techniques that use cache to speed up your web presence. The one's (that we'll focus on, are:
- WordPress Plugins
- Browser Caching
- Server-side Caching
In terms of day-to-day performance gains, caching is one of many steps you can take to ensure that your site runs as fast as possible. Faster load times typically translate to an improvement of the general usability of a site.
And it's not just the cached elements that load faster as a result. By reducing the number of calls that need to be made to the database, you are also freeing up bandwidth for non-cached elements.
Plugins, Browsers, Servers,…Varnish?
As far as caching goes, there are almost too many plugins—thirty four pages of plugin results, to be exact. Luckily you probably don't need to sift through all your options, as there are a number of heavy-hitters.
But plugins can only take you so far.
You can take advantage of the browser caching that takes place on the client side by using as many static html files in your code base as possible. And by setting proper headers on the files that you intend to remain static, the client has an easier time caching the right elements.
Server caching is a little different to the caching of files with a browser on the client side. There are quite a few ways to set up server caching on your website, but the idea is that server cache is stored on a server, and sent to the client before any of the other files do.
The way you choose to set up server-side caching ought to depend on several factors, but primarily how much traffic your site gets on average.
If you operate a smaller scale site, consider caching files locally, on the server; if you draw millions of visits a month, consider employing a reverse proxy server, which caches frequently used files on a server that is located "closer" to the client than the actual WordPress server.
Doing it right.
If you want to turn your WordPress install into a highly cached, speed demon, consider this set-up:
- Deliver all static assets through a CDN
- Proactively cache the home page
- Cache fragments (like sidebars) proactively so that they can be loaded statically
- Cache recent posts (featured posts) proactively
- Eliminate html differentiation between logged in and anonymous viewers to reduce calls for the former