Last Updated on December 1, 2019 by Christopher G Mendla
When checking our sites with some of the common page speed tools, a recurring theme of “Leverage Browser Caching” comes up.
Browser caching is simply directives in the .htaccess file that tells the user’s browser how to cache some of the site’s content. Content that is cached at the browser level does not have to be reloaded every time the user views it. For example, a header image could be cached. Then, as the user views other pages, the header image is retrieved from the user’s computer, not over the network.
NOTE – ANY TIME YOU WORK WITH THE .HTACCESS FILE YOU COULD BRING YOUR SITE DOWN.
Here is sample code that we added at the end of our .htaccess files.
AddOutputFilterByType DEFLATE text/html text/xml text/css text/plain
AddOutputFilterByType DEFLATE img/svg+xml application/xhtml+xml application/xml
AddOutputFilterByType DEFLATE application/rdf+xml application/rss+xml application/atom+xml
AddOutputFilterByType DEFLATE text/javascript application/javascript application/x-javascript
AddOutputFilterByType DEFLATE application/x-font-ttf application/x-font-otf
AddOutputFilterByType DEFLATE font/truetype font/opentype
## EXPIRES CACHING ##
ExpiresActive On
ExpiresByType image/jpg “access plus 3 months”
ExpiresByType image/jpeg “access plus 3 months”
ExpiresByType image/gif “access plus 3 months”
ExpiresByType image/png “access plus 3 months”
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”
## EXPIRES CACHING ##