What is browser caching?
The point of using browser caching and expiry headers is to shrink the number of HTTP requests, which improves the performance for your returning visitors.
With Expires headers you tell your website visitor’s browser that the files you stipulate are not changing until after a certain time, for example a month.
Finding and Modifying .htaccess
You can access your .htaccess file through cPanel by clicking on the File Manager. When the popup box appears, click on the Web Root option and make sure that the “Show hidden files” option is checked. If you are using any FTP software, go to /public_html if the site hosted in root.
The code below tells browsers what to cache and how long to “remember” it. It should be added to the top of your .htaccess file.
Pasting in the Directives to Leverage Browser Caching
Open up your
.htaccess file and paste in the following directives at the top of the file:
Save the .htaccess file and then refresh your webpage.
How to set different caching times for different file types
You can see in the above code that there are time periods like “1 year” or “1 month”. These are related with file types, as an example the above code states that a .jpg file (image) should be cached for a year. If you want to change that and say you want them only cached for a month you would simply replace “1 year” with “1 month”. The values above are pretty optimized for most web pages and blogs build on top of wordpress.
- Be aggressive with your caching for all static resources
- Expiry at a minimum of one month (recommended: access plus 1 year)
- Don\’t set your caching more than a year in advance!
You want to be cautious when enabling browser caching as if you set the parameters too long on certain files, users might not be getting the fresh version of your website after updates.