im currently facing some problems while improving page speed of a customer website. Google says: There are several resources, which are not fitting with the perfect cache-lifetime. They are not providing any best practices for that, so which value is for which resource the best?
This is currently my htaccess part:
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/x-icon "access 1 year"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 year"
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/ogg "access plus 1 year"
ExpiresByType video/webm "access plus 1 year"
ExpiresByType application/atom+xml "access plus 1 hour"
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType text/x-component "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
ExpiresByType application/x-font-ttf "access plus 1 month"
ExpiresByType application/font-woff "access plus 1 month"
ExpiresByType application/font-woff2 "access plus 1 month"
ExpiresDefault "access 1 month"
</IfModule>
Google says: its better, but not good enough. So, is there anybody who can provide me some info or best practise for the perfect resource caching time? I would really appreciate that.
Google recommends 1 year for static assets.
We recommend a minimum cache time of one week and preferably up to
one year for static assets, or assets that change infrequently. If
you need precise control over when resources are invalidated we
recommend using a URL fingerprinting or versioning technique...
Source: https://developers.google.com/speed/docs/insights/LeverageBrowserCaching
As stated you need to make sure you implement cache busting techniques to ensure you don't inadvertently serve old CSS etc.
It is calculated on a non linear scale (i.e. 6 months is not twice as good as 3 months) so it is not possible to give an exact numer of days but 6 months for all assets would pass, whereas all assets except CSS at 1 year with CSS at 1 week may not.
If you change your CSS and JS cache time to 1 year I would imagine this diagnostic would not show.
Always bear in mind these are recommendations and best practices, you have to do what is best for your site so ensure that any cache length you set is right for your use case.
Related
There are many questions out there LIKE this PageSpeed Insights wrongly reporting cache policy But none address the issue of simply ignoring the cache policies that are stated by the .htaccess file. Normally I wouldn't worry so much about this, as our sites paint completely in under 2 seconds and user experience is great. But Management cares about pretty graphs and reports.
I have the following caching policies:
ExpiresActive On
# Images
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
# Video
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"
ExpiresByType video/m4v "access plus 1 year"
# CSS, JavaScript
ExpiresByType text/css "access plus 1 week"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
# Others
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
I want to point out one in particular since it makes it easy to point out the problem:
ExpiresByType video/m4v "access plus 1 year"
If you visit the site and view the headers for said file:
You can clearly see that the setting is being sent by header and is, thus, properly configured for a 1 year policy. HOWEVER .. When using Insights, OR Lighthouse individually they both report 30 days:
Not to mention all the other policies that are transferring properly in the header, but being completely ignored by LightHouse and Insights .. Does anyone have any answer for "why" this is happening? It's infuriating that even though the headers are obviously correctly sent, Lighthouse ignores them.
I have even tried something like this to no avail:
<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf|mp4|m4v|css|js)$">
Header set Cache-Control "max-age=31536000, public"
</filesMatch>
But I don't think that will make a difference, since the headers are, in fact, being sent correctly.
my website available in siteground hosting and i am updating image optimization as per suggestion Gtmetrix and add expire header but still not updating it showing up old
after i have also flush supercacher in hosting but still not updating
my expire header code like
############################################
## Add default Expires header
## http://developer.yahoo.com/performance/rules.html#expires
ExpiresActive On
ExpiresDefault "access plus 1 year"
ExpiresByType text/html A0
ExpiresByType text/plain A0
</IfModule>
<IfModule mod_expires.c>
ExpiresActive on
ExpiresByType text/css "access plus 14 days"
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType text/javascript "access plus 14 days"
ExpiresByType application/x-javascript "access plus 14 days"
ExpiresByType image/ico "access plus 14 days"
ExpiresByType image/jpg "access plus 14 days"
ExpiresByType image/jpeg "access plus 14 days"
ExpiresByType image/gif "access plus 14 days"
ExpiresByType image/png "access plus 14 days"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType text/html "access plus 14 days"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/atom+xml "access plus 1 hour"
</IfModule>
Any help would be appreciated.
Thanks.
My name is Georgi Ganchev and I am a Technical Support Supervisor at SiteGround.
I saw your thread and I decided to follow up.
The rules in your .htaccess are correct in general, but we recommend a longer expiration date set for your images, CSS and JS stored locally.
Please check the following article we have written about the most advised configuration:
https://www.siteground.com/kb/leverage-browser-caching/
In case the issue continues, please make sure you open a ticket through the User Area of your account with us and we will gladly help you out.
Best regards,
Georgi Ganchev
Technical Support Supervisor
Siteground.com
We were trying to get a wrong result. i was searching for a solution too but what i found after reading the test result with those lines code and without them:
this code is working but only with internal files.
this code will not work with external files(from other websites like google analytics js ...).
the test result will show you only the external files.
if you remove those lines of codes the result will be worst, and it will result in more files doesn't have an expired age.
I verify my website with a SEO tools, and between the errors that I get the " If Modified Since "
When I learn about it I found that about caching, and if you modify something you drop the cache
about caching I have this .htaccess code
ExpiresActive On
ExpiresDefault "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
But I want to add the If Modified Since any solution ?
(I try to search about it but without any results)
I have an articles-blog and my articles may have a shelf-life of perhaps 1-2 weeks max. In my .htaccess I already have ExpiresByType rules (but the clutter in my MODx backend is still there and I do not understand the impact of these rules - code is below). I also have put my articles standard as indexable by the search engines.
When the shelf-life expires, I would like to permanently delete my articles. Now I do this manually and I have a whole lot of "red-crossed-out" articles titles in my back-end which makes me completely loose the overview.
My question is: What is MODx EVO best practise for my situation and is there an "automatic" way to permanently and completely (so no more red-crossed-out resource titles) remove expired articles from my MODx backend with pre-defined rules (for example, "if published time-period on the internet is 20 days then delete/remove article from MODx backend/database)"?
## Leverage Browser 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>
## Leverage Browser Caching ##
In my default .htaccess file are the following lines :
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 week"
ExpiresByType text/javascript "access plus 1 week"
1- What does mean : access plus ?
2-What happens if I change :
ExpiresByType image/jpeg "access plus 1 month"
to
ExpiresByType image/jpeg "access plus 6 months"
3-In case I change one jpeg image on the site, what image will see a visitor who visited the site within the last 2 weeks :
the previous image ?
the new image ?
4-Of course I wonder the same thing for css and javascript changes.
Thank you in advance for any information on this matter.
Kind Regards,
Patrick