In PageSpeed Insights I keep seeing the message to leverage browser caching of a particular iconset/font I'm using: iconFont.woff (2 days)
I've set my .htaccess as so:
## EXPIRES CACHING ## <IfModule mod_expires.c> ExpiresActive On ExpiresByType font/ttf "access 1 week" ExpiresByType font/woff "access 1 week" ExpiresByType image/jpg "access 1 month" ExpiresByType image/jpeg "access 1 month" ExpiresByType image/gif "access 1 month" ExpiresByType image/png "access 1 month" ExpiresByType text/css "access 1 week" ExpiresByType application/pdf "access 1 month" ExpiresByType application/javascript "access 1 month" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType image/x-icon "access 1 year" ExpiresDefault "access 2 days" </IfModule> ## EXPIRES CACHING ##
Despite this I'm still getting the same message in PageSpeed Insights. How do I cache this properly?
To leverage your browser's caching generally means that you can specify how long web browsers should keep images, CSS and JS stored locally. That way the user's browser will download less data while navigating through your pages, which will improve the loading speed of your website.
Fixing Leverage Browser Caching in WordPress with the W3 Total Cache can be done by following the steps listed below: Download and install the W3 Total Cache WordPress plugin. Navigate to General Settings and select Enable Browser Cache. Click save and navigate to Browser Cache Settings (top of the page)
What is Browser Caching in WordPress? Browser caching is a way to improve your website loading speeds. When a web page loads, all of the files will be loaded separately. This creates multiple requests between the browser and your WordPress hosting server, which increases the web page loading time.
In Google's own words: The font files themselves are cached for one year, which cumulatively has the effect of making the entire web faster: When millions of websites all link to the same fonts, they are cached after visiting the first website and appear instantly on all other subsequently visited sites.
This is doing the job for me, as Google page speed is no longer asking to fix it. The AddType is essential.
# Fonts # Add correct content-type for fonts AddType application/vnd.ms-fontobject .eot AddType application/x-font-ttf .ttf AddType application/x-font-opentype .otf AddType application/x-font-woff .woff AddType image/svg+xml .svg # Compress compressible fonts # only uncomment if you dont have compression turned on already. Otherwise it will cause all other filestypes not to get compressed # AddOutputFilterByType DEFLATE application/x-font-ttf application/x-font-opentype image/svg+xml ExpiresActive on # Add a far future Expires header for fonts ExpiresByType application/vnd.ms-fontobject "access plus 1 year" ExpiresByType application/x-font-ttf "access plus 1 year" ExpiresByType application/x-font-opentype "access plus 1 year" ExpiresByType application/x-font-woff "access plus 1 year" ExpiresByType application/font-woff2 "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 year"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With