Fix “Leverage Browser Caching” Warning
To fix the “Leverage Browser Caching” warning, you will have to perform the following two steps.
- Change request headers to use cache
- Optimize caching policy
1. Change Request Headers to Use Cache
One way to improve your website speed and response is to change request headers to use the cache. We are going to add a few lines of code to our WordPress .htaccess file.
Note: .htaccess is the control room of a website. If not configured properly, it may break down the complete site while you are at it! Learn how to protect your WordPress with .htaccess file.
To leverage browser caching in WordPress, access the main directory of your WordPress installation, search for the .htaccess file and open it with any code editor. Simply, paste the below-stated lines at the top of the WordPress .htaccess file.
- ## EXPIRES CACHING ##
- <IfModule mod_expires.c>
- 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"
- </IfModule>
- ## EXPIRES CACHING ##
2. Optimize Caching Policy
The second step to speed up response time on your website is to Optimize Caching Policy. The above code describes file types and their expiries. It’s totally up to you, how much time you want to store specific static content in the user’s browser cache. If your static content like images is long-term. I would suggest you set them for a year. However, the content you suspect that can be changed in the near future, it is suggested that you set the expiry date for at least a month.
Cache-Controls
If the above method fails to work on your server, we have another alternative around that can help you out with cache-controls to set caching expiry. All you have to do is copy and paste the following lines at the top of your .htaccess file.
- # 1 Month for most static assets
- <filesMatch ".(css|jpg|jpeg|png|gif|js|ico)$">
- Header set Cache-Control "max-age=2592000, public"
- </filesMatch>
Same as the previous step, the above code describes the expiry and caching policy of different file types.
Note: 2592000 seconds = 30 days. This is the minimum value that can eliminate the warning. If the expiry is less than this, you might still see the leverage browser warning, suggesting to increase the expiry.
0 comments:
Post a Comment