0

I have setup browser caching of all images and css/js files. Still, when I look a the browser's web developer tools under the network panel, it seems like each cached file is nonetheless retrieved from the server.

This is what I have in my .htaccess:

<ifModule mod_headers.c>
<ifModule mod_expires.c>
  # images for 1 hour
  <filesMatch "\.(jpeg|jpg|png|gif|flv|pdf|swf)$">
    ExpiresActive On
    ExpiresDefault "access plus 1 hours"
    Header set Cache-Control "public, max-age=3600, must-revalidate"
  </filesMatch>
  # CSS and js for longer
  <filesMatch "\.(ico|css|js|eot|ttf|ttc|otf|woff)$">
    ExpiresActive On
    ExpiresDefault "access plus 7 days"
    Header set Cache-Control "public, max-age=604800, must-revalidate"
  </filesMatch>
</ifModule>
</ifModule>
# do not use ETag
FileETag None

For an CSS file like https://www.fiveroasters.de/wp-includes/css/dashicons.min.css?ver=3.9.2 this results in the following headers:

Accept-Ranges   bytes, bytes
Age 0
Cache-Control   public, max-age=604800, must-revalidate
Connection  keep-alive
Content-Encoding    gzip
Content-Length  24803
Content-Type    text/css
Date    Fri, 26 Sep 2014 21:26:10 GMT
Expires Fri, 03 Oct 2014 21:26:10 GMT
Last-Modified   Tue, 27 May 2014 09:24:09 GMT
Server  Apache/2.4.10
Vary    Accept-Encoding
Via 1.1 varnish

This looks right to me, still the browser does not cache it, but each request still causes a full download (http code 200). Same for JS, images, etc. Why? You can have a look yourself at https://www.fiveroasters.de

(I have the cache settings enabled under the webtools settings.)

nachtigall
  • 2,447
  • 2
  • 27
  • 35
  • Presumably your browser has caching enabled...? – i alarmed alien Sep 26 '14 at 21:46
  • Sure. Is it cached at your browser? – nachtigall Sep 26 '14 at 22:24
  • 1
    When trying to recreate this in Chrome, I notice that when the new page is loaded, it sends the header "`Pragma: no-cache`" instead of `If-Modified-Since`, so the server correctly responds with a 200 and the page. If you refresh the page, it is loaded from cache, this is true for any page you previously loaded. This may be prompted by the `must-revalidate` directive, or might just be how Chrome works. http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9.4 – Sumurai8 Sep 27 '14 at 06:43
  • @Sumurai8 I think `must-revalidate` is only relevant for the time **after** the cache expires (that is after `max-age` and/or `Expires`?), so that the _cache MUST NOT use the entry after it becomes stale_ (from your cited RFC). – nachtigall Sep 27 '14 at 09:04
  • 1
    No. `must-revalidate` is a directive that you use to tell the client that it should revalidate the content on every subsequent request. In particular in that document: "to require revalidation of a cache entry on any subsequent use" and "Servers SHOULD send the must-revalidate directive if and only if failure to revalidate a request on the entity could result in incorrect operation". Is that really necessary for a resource that is not likely to change? If, for some reason, a client does not want to revalidate, does it really hurt if they used a cached resource? – Sumurai8 Sep 27 '14 at 14:56
  • @Sumurai8: I was thinking about this already, but this [SO answer](http://stackoverflow.com/a/8729854/1129950) (first part) says `must-revalidate` is only relevant after the cache got stale. – nachtigall Sep 27 '14 at 20:37
  • I guess the design document is ambiguous (at least how I read it). You could try it without it and see how chrome reacts. Make sure to uncheck the 'disable cache' checkmark in the top of the dev console. – Sumurai8 Sep 27 '14 at 20:41
  • Ok, seems to work now when not using "must-revalidate". Thank you! – nachtigall Sep 27 '14 at 22:14

0 Answers0