Finally, this article will show how to check if your website performance has improved with a speed test.<\/p>
\n\n\n\n<\/p>
What Is Browser Caching<\/h2>
Caching is a technique used by browsers to store pages’ content in the local storage. As such, users won’t have to download the same data all over again when revisiting the site.<\/p>
Here’s how it works: when you visit a site for the first time, the browser will download content from the server. But, when you revisit the page — or refresh it, the loading time will be shorter since the browser has stored some of the content in the web cache<\/a>.<\/p> Keep in mind that browsers can only cache static content<\/strong>, which is delivered to the users without any modification from the server. The most common examples of static content are images<\/strong>, HTML<\/strong>, CSS<\/strong>, and JavaScript<\/strong>.<\/p> The site owner can set how long the content will be cached. For example, if the interval is one year, then the cache will be cleared after that time.<\/p> If you’ve used analyzer tools like GTMetrix<\/a> and Google PageSpeed Insights<\/a>, you can see they recommend users to enable browser caching.<\/p> But the question is, aside from cutting loading time, what makes this technique a must-do for site owners?<\/p> Well, here are other benefits that you’ll get by leveraging browser caching:<\/p> First thing first, you can leverage browser caching by modifying the .htaccess file<\/a>. To do so, you can use an FTP client like FileZilla<\/a> or the file manager in your web hosting control panel. This method might suit you well if you’re an advanced user.<\/p> In this tutorial, we’re going to use Hostinger’s hPanel:<\/p> Notice from the code above that each file type has its own expiry time. For instance, gif<\/strong> images will be stored for one year<\/strong>.<\/p> You can adjust the expiry times according to your needs. However, make sure that it’s not too long because your recurring visitors might not get the updated version of your site.<\/p> One of the easiest ways to leverage browser caching and speed up a WordPress site<\/a> is by using plugins<\/strong>. There are plenty of caching plugins available in the plugin directory<\/a>, but we recommend using WP Rocket<\/strong> and WP Fastest Cache<\/strong>.<\/p> WP Rocket is a performance optimization plugin that will help you improve your site speed through various features, including browser cache<\/strong>.<\/p> If you’re using an ecommerce platform like WooCommerce<\/a>, Jigoshop<\/a>, or WP-Shop<\/a>, you might want to avoid storing high-risk data like customers’ addresses and payment details. For that reason, WP Rocket will automatically prevent browsers from caching cart and checkout pages.<\/p> Furthermore, it also provides other speed improvement features like GZIP compression<\/a>, JavaScript, HTML, and CSS minification<\/a>, and query strings removal<\/a>. To get those functions, you can purchase one of its three paid plans that range from $49<\/strong> to $249\/year<\/strong>.<\/p> Each license will provide support and updates for one year<\/strong>. If you renew the license, you’ll get a 30%<\/strong> discount<\/strong>.<\/p> You don’t need to copy-paste any license key when installing the plugin as it will be activated automatically.<\/p> If you’re looking for a free<\/strong> caching plugin with robust features, WP Fastest Cache might suit your needs. It offers browser caching<\/strong>, GZIP compression<\/strong>, and minification<\/strong> at no charge.<\/p> The plugin provides an intuitive dashboard where you can easily set up your site’s caching configuration. Simply tick a box to leverage browser caching and click a button to delete all cached files.<\/p> On another note, you can get additional features like mobile cache<\/a>, widget cache<\/a>, and cache statistics<\/a> by purchasing the premium plan<\/strong> that costs $49.99<\/strong>. However, please note that each license only works for one website<\/strong>.<\/p> You can easily download and install the free version from the WordPress plugin directory. However, it’s a bit different if you’ve purchased the premium version.<\/p> An email containing the .zip<\/strong> file of the premium plugin will be sent to your email. After that, upload the file to WordPress via the Plugin<\/strong> menu, and you’re ready to go!<\/p> Why Do We Need to Leverage Browser Cache<\/h2>
\n
Leveraging Browser Cache Using .htaccess<\/h2>
\n
![\"public_html](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2021\/10\/Screenshot-2023-03-23-at-11.15.26.png\/w=1024,h=1024,fit=scale-down\")
<\/a><\/figure><\/div>\n
## EXPIRES CACHING ## <IfModule mod_expires.c> ExpiresActive On ExpiresByType image\/jpg \"access plus 1 year\" ExpiresByType image\/jpeg \"access plus 1 year\" ExpiresByType image\/gif \"access plus 1 year\" ExpiresByType image\/png \"access plus 1 year\" ExpiresByType text\/css \"access plus 1 month\" ExpiresByType application\/pdf \"access plus 1 month\" ExpiresByType text\/x-javascript \"access plus 1 month\" ExpiresByType application\/x-shockwave-flash \"access plus 1 month\" ExpiresByType image\/x-icon \"access plus 1 year\" ExpiresDefault \"access plus 7 days\" <\/IfModule> ## EXPIRES CACHING ##<\/pre>
\n
![\"Hostinger](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2023\/11\/Web-hosting_in-text-banner.png\/public\")
<\/a><\/figure>Leveraging Process With Plugins<\/h2>
1. WP Rocket<\/a><\/h3>
![\"official](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2016\/06\/official-homepage-of-wp-rocket.png\/public\")
<\/figure><\/div>2. WP Fastest Cache<\/a><\/h3>
![\"official](\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2016\/06\/official-homepage-of-wp-fastest-cache.jpg\/public\")
<\/figure><\/div>