Do you want to improve your WordPress website performance?

Increasing WordPress website performance is a major important matter. Because a lot of WordPress website performance quality is very bad. If you have run a slow-loading website you will be lost visitors and revenue.

However, in this guide, I would like to suggest to you, how to fix Leverage Browser Caching Warning In WordPress. Leverage Browser Caching Warning issues are one kind of major problem for WordPress website performance.

Leverage Browser Caching obstructs the WordPress website performance. Not only WordPress website Leverage Browser Caching can prevent any kind of website eg, HTML or PHP website.

if you have ever run your WordPress website through GTMetrix or PageSpeed Insights then you have probably seen that big yellow Leverage Browser Caching warning.

So, I am going to start with what this warning means, how it influences you, I will an introduction to the Leverage Browser Caching warning. Then I will point out several tips for Leverage Browser Caching warning.

What is the Leverage Browser Caching

Leverage Browser Caching means accumulate static files of a website in a visitor browser. Such as images, JavaScript, CSS or HTML. And then retrieving them from the browser quickly instead of again from the server.

At any moment a browser loads a webpage and downloads all the web files to properly display the page like the HTML, CSS, JavaScript, and images. A few pages might only consist of some files and be small in size or can be kilobytes. For another however there may be a lot of files, and these may add up to be a couple of megabytes huge. Like Facebook.com, for example, is 5 MB+.

Leverage Browser Caching Warning in WordPress

How to Leverage Browser Caching with Your Server

There are many ways to leverage browser caching on the webserver. The approach you choose will mainly depend on which web server you’re using (Nginx Or Apache). You may also attend your website speed test that certain assets show an “Expiration not specified” warning while others show an actual time value ( 5 minutes). Look like the following image.

How to Leverage Browser Caching with Your Server

In the example of raised, That means that your web server does not have any browser caching rules construe for .png files and the expiry time is only 5 minutes for .css files.

In the following sections, I would like to how to enable Expires and Cache-Control headers on the Apache Web server and Nginx Web servers.

Cache-Control Headers on Nginx

Add the following code snippet of your server block which located at /etc/nginx/site-enabled/default

location ~* \.(png|jpg|jpeg|gif)$ {
    expires 365d;
    add_header Cache-Control "public, no-transform";
}

location ~* \.(js|css|pdf|html|swf)$ {
    expires 30d;
    add_header Cache-Control "public, no-transform";

Cache-Control Headers on Apache

Add the following code snippet in your .htaccess file.

<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
    Header set Cache-Control "max-age=2592000, public"

Expires Headers on Nginx

Add the following code snippet of your server block which located at /etc/nginx/site-enabled/default

location ~* \.(jpg|jpeg|gif|png)$ {
    expires 365d;
}
location ~* \.(pdf|css|html|js|swf)$ {
    expires 30d;
}

Expires Headers on Apache

Add the following code snippet in your .htaccess file.

## EXPIRES CACHING ##

    ExpiresActive On
    ExpiresByType image/jpg "access 1 year"
    ExpiresByType image/jpeg "access 1 year"
    ExpiresByType image/gif "access 1 year"
    ExpiresByType image/png "access 1 year"
    ExpiresByType text/css "access 1 month"
    ExpiresByType text/html "access 1 month"
    ExpiresByType application/pdf "access 1 month"
    ExpiresByType text/x-javascript "access 1 month"
    ExpiresByType application/x-shockwave-flash "access 1 month"
    ExpiresByType image/x-icon "access 1 year"
    ExpiresDefault "access 1 month"

## EXPIRES CACHING ##

Once complete on your origin web server, you can check if everything is working as normal by opening up Browser Dev Tools or Chrome Dev Tools, operate to the Network tab, and click on an asset. You shall now see either the Cache-Control, Expires, or both HTTP Response headers.

HTTP Response headers

I think, if you follow the provided suggestion, the Leverage Browser Caching Warning problem will be solved.

Fix Google Analytics Leverage Browser Caching Warning in WordPress

The most common leverage browser caching warning issue comes from Google’s own script e.g Google Analytics. The issue is that set a low 2 hour cache time see in the screenshot below.

leverage-browser-caching-pagespeed-insights-analytics

There is an excellent free plugin available on WordPress for Complete optimize GA(Google Analytics script) this plugin developed by Daan van den Bergh which grants you to host Google Analytics locally on your WordPress website. This plugin name is CAOS | Host Google Analytics Locally

The plugin available on the WordPress Plugin directory so you should download this plugin for your website. The plugin grants you to host your GA JavaScript file e.g analytics.js locally and keep it updated using WordPress wp_cron() function.

Further benefits to hosting your Google Analytics script locally are that you reduce your external HTTP requests to Google from 2 down to 1 and you now have full authority over the caching of the file.

Host Google Analytics Locally

So, Just install the plugin and enter Google Analytics Tracking-ID and the plugin adds the needed Tracking Code for Google Analytics to the website header or footer.

If you want to use a plugin to remove the Leverage Browser Caching Warning in WordPress, I would like to recommend this plugin for you. Leverage Browser Caching – WordPress plugin, You do not need to set up this plugin, just need to instill and active.

Fix Leverage Browser Caching Warning with Caching Plugins

I am going to make another paragraph because I would like to suggest to you the best WordPress caching plugins, These plugins will help you to fix Leverage Browser Caching Warning in your website.

If want to use a caching plugin. Caching plugin already has included browser caching settings. Just your need to activate options from the plugin settings.

Let’s now survey a few popular WordPress caching plugins.

Finally, In this short guide, I covered the popular caching plugins you might want to fix to Leverage Browser Caching Warning in WordPress. So, Let’s Enjoy it!

Conclusion

I hope this guide will help to fix WordPress Leverage Browser Caching Warning and Google Analytics Warning. if you have any questions, please feel free to comment. If your website slows yet, You can check my other article for the Speed up WordPress website.

I hope, If you follow my suggestion, your WordPress Website performance will be improved.

If you need help to increase website performance, you can hire me for this job. I can speed up a WordPress website. So, Please check the details of my services: Speed Up WordPress Website

Author

The Best WordPress And WooCommerce Tutorial Website

My name is Tanmoy Biswas from Bangladesh and I am a Professional Programmer. I have been working for the last 6+ years with PHP, SQL, and WordPress. I have extensive knowledge of web development especially with PHP, SQL, AJAX, JavaScript, CSS, HTML, WordPress, WooCommerce.