Issue about the Age response header and the term "Reload"

[yionr]

MDN URL

https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching

What specific section or headline is this issue about?

reload;fresh_and_stale_based_on_age

What information was incorrect, unhelpful, or incomplete?

About "Reload"

Sorry but, what action is called Reload? Is the refresh button? During the article, it say Reload action will put Cache-Control: max-age=0 in request header. But I have tried many sites, like google github, when I click refresh button, it shows the resource is getting from cache and show the provisional header(there is no max-age header at all).
I mean, in my first read, I can't recognize the term Reload's corresponding action, the only information the article provided is:

For recovering from window corruption or updating to the latest version of the resource, browsers provide a reload function for users.
But normally, I use refresh button can also do the same effect.

About "Age" response header

In the article, it says:

When a response is stored in a shared cache, it is necessary to inform the client of the response's age.

and RFC2616 write the same:

The Age response-header field conveys the sender's estimate of the
amount of time since the response (or its revalidation) was
generated at the origin server.

An HTTP/1.1 server that includes a cache MUST
include an Age header field in every response generated from its
own cache.

But this RFC was obsoleted, in RFC9111, there is no description about if cache server MUST include a Age header:

The presence of an Age header field implies that the response was not generated or validated by the origin server for this request. However, lack of an Age header field does not imply the origin was contacted.

Finally, I did a experiment, I use nginx as proxy server, open it's cache function, config origin server's max-age, and successfully watched cache is HIT, but I can't watch Age header during this whole experiment. I asked nginx's community for help, but no team member reply me.

What did you expect to see?

For reload, is the Reload's description wrong? Or I think it's better have a example action as a hint.

For latter, maybe "When a response is stored in a shared cache, it is NOT necessary to inform the client of the response's age." or just delete the sentence.

Do you have any supporting links, references, or citations?

https://stackoverflow.com/questions/6239090/reload-vs-refresh
https://datatracker.ietf.org/doc/html/rfc2616#section-14.6
https://datatracker.ietf.org/doc/html/rfc9111#name-age
https://nginxcommunity.slack.com/archives/C02MRSU7CKT/p1695369835259619

Do you have anything more you want to share?

No response

MDN metadata

Page report details

• Folder: en-us/web/http/caching
• MDN URL: https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching
• GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/http/caching/index.md
• Last commit: 6eea9fd
• Document last modified: 2023-09-15T11:43:00.000Z

[Josh-Cena]

Pinging @Jxck, maybe?

[Jxck]

@yionr

for Realod

But I have tried many sites, like google github, when I click refresh button, it shows the resource is getting from cache and show the provisional header(there is no max-age header at all).

What browser do you use ?
Reload can happen via reload / refresh button on browser UI or shortcut of F5, cmd+r or so, and also option of fetch(). It happens on request, not rely on the site you access.

for Age

The presence of an Age header field implies that the response was not generated or validated by the origin server for this request. However, lack of an Age header field does not imply the origin was contacted.

this line in RFC 9111 doesn't mentioning about any requirement for Age header.
So we should also not mentioning about "require" / "not require"

- When a response is stored in a shared cache, it is necessary to inform the client of the response's age.
+ When a response is stored in a shared cache, it is possible to inform the response's age.

I'll PR here.

[yionr]

@yionr

for Realod

But I have tried many sites, like google github, when I click refresh button, it shows the resource is getting from cache and show the provisional header(there is no max-age header at all).

What browser do you use ? Reload can happen via reload / refresh button on browser UI or shortcut of F5, cmd+r or so, and also option of fetch(). It happens on request, not rely on the site you access.

for Age

The presence of an Age header field implies that the response was not generated or validated by the origin server for this request. However, lack of an Age header field does not imply the origin was contacted.

this line in RFC 9111 doesn't mentioning about any requirement for Age header. So we should also not mentioning about "require" / "not require"

- When a response is stored in a shared cache, it is necessary to inform the client of the response's age.
+ When a response is stored in a shared cache, it is possible to inform the response's age.

I'll PR here.

I use Chrome 117.0.5938.150 and also have tried recently released versions, and Edge

reload_demo.mp4

I record a demo here, before this demo, I have cleared all the cache in the browser and restarted the browser. Then I first visit a site, then find a request, it's Cache-Control shows public etc, then I clicked reload button on top left, but the Cache-Control in the same request doesn't change, and the request is tagged from memory cache.

Obviously, this is a situation where caching comes in handy. But, the article say when reload is triggered, request will add max-age:0, which is weird.

Maybe I have misunderstood in somewhere, can you help me make it clear?

[Jxck]

@yionr what you see is "Response Header". Reload affects to "Request Header".

[yionr]

@Jxck I'm sorry, I made a mistake by accident. But since the response is cached by the client(browser),it didn't process request header anymore.

20231004_133828.mp4

---

https://developer.chrome.com/docs/devtools/network/reference/?utm_source=devtools#provisional-headers

However, if I checked Disable cache, then the max-age still won't appear.

[Jxck]

I found you see the Subresource (js, css, img etc), not Main Resources (HTML).
Chrome and Safari doesn't GET subresources while reloading. See more details below.
(It's not a spec related things, but intervention by implementation)

• https://blog.chromium.org/2017/01/reload-reloaded-faster-and-leaner-page_26.html
• https://groups.google.com/a/mozilla.org/g/dev-platform/c/PMla_a7HYKY/m/qMOguUN1AAAJ

However, if I checked Disable cache, then the max-age still won't appear.

there are two type of request from browser by UI. And they behave differently.

1. Navigation (link click, input url to url bar)
   • cache is reused by browser or sending request with validation if applicable (if-modified-since, if-non-match)
2. Reload (reload icon on browser, F5, cmd+r)
   • bypass browser cache, sending request with max-age=0
3. Super Reload (shift + cmd + r, shift + F8 ?)
   • bypass browser cache, sending request with no-cache

Disable Cache on devtools is equivalent with Super Reload. So you send no-cache.

[yionr]

I get it! Thank you very much!!!

After reload, the max-age=0 appear in Main Resource. I'm really excited!

Finally, is there a pretty way to inform readers to know this implementation? I think there are many people like me, who first start learning cache concept from this article, but don't know this implementation(the different reload way between subresources and Main Resource), and finally can't watch the true result.

In my view, maybe add following:

...
The max-age=0 directive in the request specifies "reuse of responses with an age of 0 or less" — so, in effect, intermediately stored responses are not reused.

As a result, a request is validated by If-None-Match and If-Modified-Since.

Note that depends on browser implementation, subresources(js, css, img etc) will not be revalidated during reload, only Main Resource(HTML) will. See details below:

Chrome now has a simplified reload behavior to only validate the main resource and continue with a regular page load.

https://blog.chromium.org/2017/01/reload-reloaded-faster-and-leaner-page_26.html

My English is not good at present🤣

[Jxck]

Finally, is there a pretty way to inform readers to know this implementation? I think there are many people like me, who first start learning cache concept from this article, but don't know this implementation(the different reload way between subresources and Main Resource), and finally can't watch the true result.

Yeah, I'm agree with that. It's fine if we adding a section or article for "Reloading" describes this behavior.
Let me think about it.

[Jxck]

Ah I forgot but it already mentioned here.
https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching#reload_and_force_reload

[yionr]

Yes, there are already descriptions about reload, But I mean, it might be helpful to understand the mechanism that the browser make a difference reload action between Main Resource and Subresource, which is not mentioned in the section.

In the article, it is written as:

A simplified view of the HTTP request sent during a browser reload looks as follows:

Readers may think that all the requests act as the same, but in fact, the browser treats Main Resource and Subresource as different during a reload.

Finally, I respect your opinion, and it's also possible that the number of people encountering this issue is actually quite small. Perhaps content here is any inappropriate.