8

Google Pagespeed Insights still tells me that I have to enable browser caching, but I don't understand what I'm missing. I'm using cloudflare with optimizations enabled. I see this HTTP header in chrome developers tools:

cache-control:public, max-age=86400

so caching already seems enabled! I also added 

<staticContent>
    <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="1.00:00:00" />
</staticContent>

in my web.config file.

I don't know what else to do. Here is the error that Google gives me:

enter image description here

Improve this question
1
  • 2
    You need to do ~8 days for the expire in order to pass that rule.
    – dhaupin
    Jun 29, 2016 at 19:24

2 Answers 2

Reset to default
6

24 hours is too little to suffice as cache control :) In theory, images never change without their name also changing, so you can set that easily to a year (or a month if you feel more comfortable with that).

If you replace an image with a new image, it has a new name. picture-of-cat-on-18th-birthday.jpg will not suddenly be an other image with the same filename. For this reason, filenames should be somewhat specific to their content.

For other types of resources like CSS and JS you might want to opt for a different tactic. You have (often) changing files, and never/barely changing, you want to split the caching length of them:

  • never changing -> very long cache
  • changing -> low cache

This is not doable. You can do them both or none, .htaccess sees a filetype.
Because of this, you set it to the long cache, and use a postfix to force a new download if it does change: 

<script src="static.js" />  
<script src="changing.js?last_update=150422" />

This way the user only has to redownload it if you've actually made a change.
This technique works on all resources. Always aim for the highest duration of caching.

Improve this answer
3
  • thank you! solved the problem. yeah it was too short, putted everything to 8 days so it won't give me the message anymore. problem is the widgets! things like purechat and kudobuzz, facebook plugin and google+. they are slowing my site and not caching well...
    – euge9522
    Apr 22, 2015 at 16:10
  • connect.facebook.net/en_US/all.js (20 minutes) connect.facebook.net/it_IT/sdk.js (20 minutes) apis.google.com/js/api.js (30 minutes) oauth.googleusercontent.com…e:rpc:shindig.random:shindig.sha1.js?c=2 (60 minutes) google-analytics.com/analytics.js (2 hours)
    – euge9522
    Apr 22, 2015 at 16:11
  • You can set a huge cache on CSS and JS files as long as you querystring timestamp the src...which you can do dynamically with filemtime(). Then if the file is modified a new uri will be created, forcing re-acquisition of the asset without clearing caches and things. Can do the same thing with images or whatever too. And i think Google likes cache time of something like 8 days minimum to pass the pagespeed.
    – dhaupin
    Apr 22, 2015 at 16:35
4

I see that the previous answer says that 24 hours is not enough. But looking into Google document: https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/http-caching#defining-optimal-cache-control-policy it says that the images be cached for 1 day for optimal caching.

Caching images for short time makes sense, because in order to improve the SEO, it is better not to fingerprint the images. So it is a good trade-off if you want to change the image.

Also not that after 24 hours images will be loaded again (when you set the cache control to 1 day), it will then use the e-tag and compare the images by making a server roundtrip and recache.

So, the question remains why the pagespeed insight tool does not respect Google's own recommendation.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.