Browser caching is the way a browser stores files from your website on a local computer. Browser caching makes sure all files load without unnecessary server connections, which is much faster. In this article, we’ll tell you how to check if that browser cache works and how to optimize it in WordPress.
What is browser cache?
Browser cache allows you to skip server connections and pull resources right from your local computer. This cache works like the temporary internet files that take up so much space on our computer. You want it there, as it helps to speed up things. But you don’t want it there forever, as things might change on a website. You can set this ‘refresh’ rate to whatever expiration time your want: the longer, the better.
List of expiration times
In most cases, you can set expiration times in seconds. Here’s a handy list of possible expiration times for your browser cache:
- 3600 seconds (hour)
- 86400 seconds (day)
- 172800 seconds (two days)
- 604800 seconds (week)
- 2592000 seconds (month)
- 31536000 seconds (year)
Become a technical SEO expert with our Technical SEO 1 training! »
Info
Testing your browser cache
In this section, we’ll show you a couple of site speed tools we use to check browser caching in our reviews. Which one you’d like to use to check browser caching for your website, depends on personal preferences as well.
YSlow
My personal favorite for checking browser caching is Yahoo’s YSlow. It’s available as a browser extension, works pretty fast and checks a lot more that just the expiration times of your browser cache. Here’s a screenshot:
ETags
Besides just a simple expire headers check, YSlow also allows you to check for entity tags, which are also called ‘ETags’. These ETags are used to “determine whether the component in the browser’s cache matches the one on the origin server.” This helps a browser determine if a new file is available. Note that ETags tend to slow down a website, so please dive into the subject and see if you really need these.
Google PageSpeed Insights
Google provides its own check for browser caching in PageSpeed Insights. If the section ‘Should Fix’ contains the recommendation ‘Leverage browser caching’, you should definitely address this.
As you can see in the image above, like YSlow, Google PageSpeed Insights tells you which files need a (far future) expiration date. And that these are usually CSS files, JavaScript files or (template) images.
If these tools aren’t clear enough, there are more tools we rely on to do extra checks, like Pingdom and GT Metrix.
WordPress plugins that help browser caching
Browser caching is something you can for instance set in your .htaccess file. For most users, that’s probably not something you do every day. However, if you are using WordPress, you’re in luck. There is a number of plugins that can help you with this. We’d like to highlight our favorite.
WP Rocket
At Yoast, we’re fans of the WP Rocket plugin. It’s simplicity, combined with a lot of options, make this our to-go-to speed optimization plugin. Browser caching is enabled right after activation of the plugin. Feed cache and mobile cache can be enabled in the plugin. Find out more here.
WP Rocket is really our first recommendation. Having said that, WP Engine as a host is also caching very well by default! At yoast.com, we use WP Engine in combination with Sucuri’s WAF. Just to be complete :)
Thanks for another great article.
Being a W3 Total Cache user myself I’d sure agree about it’s myriad of options and possible pitfalls. Would you say WP Rocket is able to achieve similar speed gains despite it’s simplicity?
I do. The thing is that W3 Total Cache allows you to tweak performance even more, gaining perhaps some extra points in for instance Google PageSpeed. But for the majority of things to do when optimizing for speed both work, but WP Rockets is definitely the one to use for the vast majority of WordPress users.
I will definitely try WP Rocket Plugin.
Is cloudfare fine?
Don’t know, have you tested it on your website? That’s really the best way to find out. MaxCDN is also an alternative, for a comparison see here.
Thank you, for the helpful information .
WP Fastest Cache, in my opinion, is absolutely the best caching plugin :)
Hi,
I’ve been using your plug-ins for some time now and it’s great. Thank you for this article. I still use W3 Total Cache on all my websites and did try WP Rocket : I’m thinking of switching, because I’m not sure that W3TC is still developped and/or supported (it’s been said on the support forum), but I have no confirmation.
Do you have insider information about that ? :-)
Nope, but I’d give WP Rocket a spin for sure. I really like it!
Thanks for this! I tried W3 Total cache with no luck. Then, I decided to try WP Super Cache, and now, after doing some reading, I’m afraid to uninstall it. I’ve heard good reviews about WP Rocket and wish that I had tried them first. Because they offer support, maybe they can help me uninstall WP Super Cache. I’m afraid of messing up my site. Thank you, again, for the helpful information.
Great information.. this article is very helpful for seo point of view.
Great article, thanks.
Any suggestions for additional caching when running under CloudFlare? All CF speed options are toggled including Rocket Loader.
I have seen a noticeable increase in performance when caching pages to disk with W3TC on top of CF.
To be honest, I haven’t tested Cloudflare enough to answer that question. I do know that if you have the option to cache ro anything else than disk (probably still your own server, right), that might work eveb better.
Anyone any thoughts on this? Please do comment!
Nice article. And what about AppCache (manifest) next to browser cache, any opinion?
Depends on multiple things, enable it and test it ;-)
Very good post. Really who does not know the confgurar W3TC can do very badly. I have seen several websites mangled because of it. And each webste need a different configuration for the host and the theme can infuence much.
I got good results with W3TC but the host also helps a lot .
Agreed! Thanks for your addition!
Why not add the code for the htaccess in this blog as well? For those who want to limit their plugin numbers.
Hi Martin, thanks for your comment! .htaccess is a powerful thing to play with and a lot of website owners haven’t even heard of it, I left it out so no harm can be done on the account of this article. Plugins, especially WP Rocket, make browser caching a lot easier.
If you want to use .htaccess for browser caching, please check this article by GT Metrix.
Your link doesn’t seem to work. Could you point me to the correct page?
I know what to add to the htaccess but I would still like to read that article to see if there are any pointers I missed.
Fixed, Martin. I forgot to include http:// in the link. Done now :)