I'm trying to troubleshoot something on the client and I believe it has something to do with the the browser caching requests.

I'm loading the same page on Firefox and Chrome (Canary). When I look in the network tab, I see different behavior.

There server response has a max-age set for cache control. I see that Chrome always loads from (disk cache) if max-age has not been reached. But for Firefox, I'll see it load the resource not from cache once in a while before max-age has been reached. Also I'm seeing 304 'not modified' in Firefox, but not in Chrome.

Also, the behavior from 'Refreshing' a page vs. 'Refreshing Bypass Cache' is not expected.

Can someone help explain what I'm seeing?

Here are some screenshots of the Network tabs... Firefox Network Panel Chrome Canary Network Panel

According to this Google article and HTTP-caching...

...the client automatically provides the ETag token in the "If-None-Match" HTTP request header. The server checks the token against the current resource. If the token hasn't changed, the server returns a "304 Not Modified" response, which tells the browser that the response it has in cache hasn't changed and can be renewed....

I've annotated each network line with what my action was that logged that line. (I performed the same sequence in Chrome later...you can see that the max-age is less).

It's curious that in Firefox after the Initial Page Load (when I just refresh the page normally) I see some cached response, some 304's and then an actual non-cached response with a max-age=3600. I expected to see cached responses. Also, if not cached, I expected the max-age to be less than 1490 (max-age of the initial page load).

Then later on after I do a Refresh bypass Cache (SHIFT+CMD+R on Mac)...I curiously see a cached response, then a 200 response with correct max-age=1366. Then further Refresh bypass Cache actions shows cached responses.

I also want to note that each of the actions that I took were less than 30 seconds apart (most of them were less than 5 seconds apart).

Update I found this post and it explains why the 304's.

it is because the browser is not sending a If-Modified-Since during the request

This is what the request header looks like for the Firefox 304.

304 Request Header

But now I have an additional question...why is the browser not sending the 'If-Modified-Since' and the "If-None-Match" headers all the time when max-age has not been reached?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.