how to use control-cache headers?

Question

I downloaded Google speed tracer for Google chrome to see how my site does performance wise and it tells me I need to enable caching for certain files like my style.css, images, etc.

I've read that the below php code should tell browsers to cache html content. I wrote a quick php page with a couple of images on it and stuck the below code at the top (before the headers are sent) to test to see how it worked.

Header("Cache-Control: public, max-age=3600, must-revalidate");

When I go back to speed tracer's analysis it says...

Summary From Cache: false

Request Headers Pragma: no cache Cache-Control: max-age=0

but under Response Headers... Cache-Control: public, max-age=3600, must-revalidate (exactly what I specified)

I'm a little confused, what's going on...? When it says from cache: false does that mean from the server cache and not the client's cache?

Answer 1

When it says from cache: false does that mean from the server cache and not the client's cache?

^ This is referring to the client cache.

Setting up caching in this manner will cover your PHP files, but you'll need to implement something else server side to cache your images, CSS, scripts, etc. This can be done using .htaccess, if your server supports it.

For example, this is what I'm using in my .htaccess file for a couple sites.

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
  Header set Expires "Thu, 15 Apr 2012 20:00:00 GMT"
  Header unset ETag
  FileETag None
</FilesMatch>

Answer 2

The key is must-revalidate: This means, that the client is asking the server if the file has changed. If you don’t handle this case, the browser will fetch a new copy.

Read Mark Nottingham’s fantastic Caching Tutorial for more information. As an example for a PHP implementation you may use my code.

Look into $_SERVER['HTTP_IF_NONE_MATCH']and $_SERVER['HTTP_IF_MODIFIED_SINCE'] for validating clients. And be aware that both headers may contain malicious code. ;)

Answer 3

I'm not familiar with this tool, however until any browser has fetched content with caching headers it won't be able to cache it. It appears that your server is sending back the expected headers and the page should be cached by the browser - your browser should now have a copy in its cache. If you try fetching the same page again then it will be fetched from the cache rather than the origin server (assuming the 1 hour time limit hasn't expired).

Note that some browsers will interpret a refresh request as an explicit request to ignore the cache and fetch the page again - try accessing it via link rather than hitting the refresh button.

C.