How can I tell the “current age” of a cached page?

Question

I'm wondering how the browser determines whether a cached resource has expired or not.

Assume that I have set the max-age header to 300. I made a request at 14:00, 3 minutes later I made another request to the same resource. So how can the browser tell the resource haven't expired (the current age which is 180 is less than the max-age)? Does the browser hold a "expiry date" or "current age" for every requested resource? If so how can I inspect the "current age" at the time I made the request?

Answer 1

Check what browsers store in their cache

To have a better understanding on how the browser cache works, check what the browsers actually store in their cache:

• Firefox: Navigate to about:cache.
• Chrome: Navigate to chrome://cache.

Note that there's a key for each cache entry (requested URL). Associated with the key, you will find the whole response details (status codes, headers and content). With those details, the browser is able to determine the age of a requested resource and whether it's expired or not.

The reference for HTTP caching

The RFC 7234, the current reference for caching in HTTP/1.1, tells you a good part of the story about how cache is supposed to work:

2. Overview of Cache Operation

Proper cache operation preserves the semantics of HTTP transfers while eliminating the transfer of information already held in the cache. Although caching is an entirely OPTIONAL feature of HTTP, it can be assumed that reusing a cached response is desirable and that such reuse is the default behavior when no requirement or local configuration prevents it. [...]

Each cache entry consists of a cache key and one or more HTTP responses corresponding to prior requests that used the same key. The most common form of cache entry is a successful result of a retrieval request: i.e., a 200 (OK) response to a GET request, which contains a representation of the resource identified by the request target. However, it is also possible to cache permanent redirects, negative results (e.g., 404 (Not Found)), incomplete results (e.g., 206 (Partial Content)), and responses to methods other than GET if the method's definition allows such caching and defines something suitable for use as a cache key.

The primary cache key consists of the request method and target URI. However, since HTTP caches in common use today are typically limited to caching responses to GET, many caches simply decline other methods and use only the URI as the primary cache key. [...]

Some rules are defined regarding storing responses in caches:

3. Storing Responses in Caches

A cache MUST NOT store a response to any request, unless:

• The request method is understood by the cache and defined as being cacheable, and

• the response status code is understood by the cache, and

• the no-store cache directive does not appear in request or response header fields, and

• the private response directive does not appear in the response, if the cache is shared, and

• the Authorization header field does not appear in the request, if the cache is shared, unless the response explicitly allows it, and

• the response either:

  • contains an Expires header field, or

  • contains a max-age response directive, or

  • contains a s-maxage response directive and the cache is shared, or

  • contains a Cache Control Extension that allows it to be cached, or

  • has a status code that is defined as cacheable by default, or

  • contains a public response directive.

Note that any of the requirements listed above can be overridden by a cache-control extension. [...]

Answer 2

Usually (but not always) the server providing the resource will provide a Date header, indicating the time at which that resource was requested. Caching entities can use that Date and the current time to find the resource's age. If the Date response header does not appear, that the caching entity will probably mark the resource's request time in other metadata, and use that metadata for computing the age. Another possibly helpful response header to look for is the Last-Modified response header.

So first, you should check if the cached resource has the Date header for your own age calculation. If not present, it will then depend on which specific browser you are using, and how that browser handles caching for Date-less resources. More information on HTTP caching and the various factors involved, can be found in this caching tutorial.

Hope this helps!