Learn How to Leverage Browser Caching in WordPress
WordPress Browser Caching Matters
What is leverage browser caching?
Leverage Browser Caching refers to storing static files of a WordPress site in the visitor browser. And then retrieving them from the browser quickly instead of again from the server.
Fix Leverage Browser Caching Without Plugin
Steps to Fix Leverage Browser Caching via htaccess (without plugin)
Fix Leverage Browser Caching With Plugin(no htaccess method)
It can be done just by adding a plugin like w3 total cache or WP Rocket and sometimes it requires some server changes. Another more simple option is to use cloudflare CDN free one will solve the browser cache issue and paid one will optimize the images as well.
W3 Total Cache or WP Rocket: Best Caching Plugin For WordPress?
The best is a server-level caching setup like LiteSpeed Cache or FastCGI for NGINX. These completely eliminate the need for running any PHP scripts of WordPress for serving cached pages. So they are more efficient. LiteSpeed Cache for WordPress works seamlessly with the LiteSpeed server so it is the easiest to deal with when compared to other solutions like FastCGI.
LiteSpeed Cache WordPress plugin
LiteSpeed Cache plugin is the most advanced but only if your server is using Litespeed otherwise Wp Rocket and Nginx helper for Nginx servers. I use to use W3 Total Cache over WP Rocket as I use to get faster websites they even tried to match my performance that W3TC was giving me. This was 3 years back. Today it’s the other way around. I have drop W3TC Pro and only use WP Rocket or Litespeed depending on server set up.
Fix Leverage Browser Caching with LSCache Plugin
After Installing the LiteSpeed cache plugin go to the cache setting option from
This will add the above-mentioned code into the htaccess file of your root. The code will be added automatically and you don’t need to touch the htaccess file. You can choose a cache lifespan but leave it to default unless you have a very dynamic content-based website
Fix Leverage Browser Caching with WP Rocket Plugin
WP Rocket auto applies the browser caching upon activation. After activating WP Rocket you can test your site with PageSpeed Insight or GTMetrix or Pingdom Tools and you will notice the browser caching warning is gone. WP Rocket also separates the caching for mobile if you choose to do so.
FAQ on Leverage Browser Caching
I recently had plenty of issues with Hummingbird asset optimization as well and ended up removing it, had it for a year with no problems, and then that. WP Rocket is a really good one, I have it on most of my sites. I’ve done comparisons on the same site and it’s pretty even with WP Rocket metrics-wise. But WP Rocket perceived load times are insane. Even if performance metrics are even, UX ends up feeling faster on WP Rocket.
Personally, I believe setting 1 year for browser cache is counter-productive for dynamic eCommerce sites. I’m doing updates, changes, etc every day on my site. So I can’t imagine what would happen if a user comes back after 10 months, browsing on my site while thousands of changes would have been made meanwhile, therefore harming the user experience. If you have a really good host, good site optimization, and cache preloader, you can reduce the browser cache to a few weeks at most.
Caching HTML pages for 1 year or even 1 hour is definitely a bad idea. But caching static files for 1 year is actually good. Most of the plugins/themes add version no. at the end of static files so that if there is a change, new files will be delivered. Similarly, most of the cache plugins generated hashed file names to automatically send updated files.