Leveraging Browser Caching

leveragingbrowser

Lets have a look at how you can leverage browser caching to further optimize your site and reduce your load times. First off, what is browser caching? A web browser cache stores elements from a site such as HTML files, fonts and scripts so when you re-visit that site it doesn’t have to re-download everything, saving time and data.

This cached data can be used to help optimize the users load times on your own websites by ensuring the expiry dates are set correctly (how long the data is stored for in the cache before needing to be re-downloaded when the site is revisited).

To edit expiry dates you need to edit the .htaccess code file for your website. For each element you’ll need to set an expiry date, bearing in mind this means that users may not always be getting the latest version of your site on each visit. Obviously certain file types will need shorter expiry dates as they will be updated more often than others. An example of what you would input to the top of your .htaccess file can be seen below.

## 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 2 days"
</IfModule>
## EXPIRES CACHING ##

We have a support article which goes into deeper detail around browser caching which you can read here.

Share this postShare on Facebook3Tweet about this on TwitterShare on Google+0Share on LinkedIn5