Leverage Browser Caching in WordPress, IIS, and Apache Server
Are you seeking for a descriptive tutorial to see how to enable leverage browser caching? I think you are trying to optimize your website loading time and to optimize the Google page speed insight score.
If one of the above questions hits your query, you are on the right source. Here you will learn everything about enabling browser caching and its advantages for web performance and search engine optimization.
Leverage browser caching helps you to improve your web page speed and Google inside score. Read the entire tutorial carefully to know all about caching. Here we will explain what leverage browser caching is and how to enable it.
If you are using WordPress, PHP, or apache serve, you have to update HTTP headers in your .htaccess file, or if you are using ASP .net or IIS server, you have to set HTTP headers in your web.config file to enable leverage browser caching.
Table Of Contents
What is Browser Caching?
Leverage browser caching is a process to save web page resources on a visitor’s computer when he loads a web page. Whenever a browser loads a website, it has to request many HTTP requests to display a web page.
These HTTP requests consist of some images, HTML files, CSS files, JS files, videos, and more. If you enable leverage browser caching, it will help you to improve your web page loading time by serving matching files from the cache.
Why is Browser Caching Important?
Leverage browser caching is very important to reduce your web page loading time by saving matching files to the visitor's web page and use them again from the cache.
It will improve a web page speed by saving commonly used image files, HTML files, CSS files, and JavaScript files to the visitor's web browser and will server again and again whenever needed.
As we know, web performance and user-experience both are the parts of search engine optimization. If we are enabling the browser caching, we are affecting both factors, so it is also helpful from the SEO perspective.
How to Enable Leverage Browser Caching?
To enable leverage browser caching, you need to update the requested headers of our files to use caching. You have to update your HTTP headers to set expiry times for all types of files on our web server.
If you are using the Apache server, you have to update HTTP headers in your .htaccess file, or if you are using the IIS server, you have to update HTTP headers in your web.config file to enable leverage browser caching.
Enable Browser Caching on Apache Server
Follow these simple steps to enable leverage browser caching in PHP and Apache server via .htaccess file hosted on your server:
- Login Cpanel: Login your hosting panel or control panel.
- Find Htaccess File: Find .htaccess file in your root directory.
- Open .htaccess File: Open .htaccess file in your web browser.
- Add IfModule Code: Add IfModule Code in your .htaccess file given below.
- Save Htaccess File: Finally, save the .htaccess file.
<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 application/pdf "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
Enable browser caching on IIS server via web.config
Follow these simple steps to enable leverage browser caching in ASP .net and IIS server via web.config file hosted on your server:
- Login Cpanel: Login your hosting panel or control panel.
- Find Web.config File: Find the web.config file in your root directory.
- Open Web.config File: Open the web.config file in your web browser.
- Add cacheControlMode: Add cacheControlMode in your web.config file given below.
- Save Web.config File: Finally, save the web.config file and check for caching.
<configuration>
<system.webServer>
<staticContent>
<clientCache cacheControlMode="UseExpires" httpExpires="Tue,19 Jan 2038 03:14:07 GMT"/>
</staticContent>
</system.webServer>
</configuration>
Enable browser caching on WordPress via W3 Total Cache
Follow these simple steps to fix leverage browser caching in WordPress with the W3 Total Cache plugin:
- Download and install the W3 Total Cache WordPress plugin.
- Navigate to global settings and select allow browser cache.
- Click save and travel to browser cache settings.
- Choose the cache headers available.
- Set expires, cache-control with ETag headers.
- Save all settings and reload your website.
Conclusion
We have discussed everything about browser caching, its uses, importance, and benefits for web performance as well as search engine optimization and web performance. This post will help you in enabling the caching for your website.
Leverage browser caching helps to optimize web page loading time and Google insight score. Once you have enabled leverage browser caching, Visit Google web speed insights or GTMetrix to check your web page for browser caching.