How long will cached CSS file get updated in browser?

Question

How long will cached CSS file get updated in browser if I don't do anything specifically?

I googled this but haven't found a clear answer. I know I can use file.css?v=1 to force the browser to load the updated version or I can use hard reload feature of the browser. But what if I don't do all of these? So far the browser will always load the cached old version.

Without hard reload and any other setup in server, how long will a local browser update the cached CSS file? Will the cached version stay there forever? (unless the cache space is full to make space).

Answer 1

The following are excerpts from the above link on HTTP Caching:

4.2. Freshness

...Since origin servers do not always provide explicit expiration times, caches are also allowed to use a heuristic to determine an expiration time under certain circumstances (see Section 4.2.2)....

4.2.2. Calculating Heuristic Freshness

...If the response has a Last-Modified header field (Section 2.2 of
[RFC7232]), caches are encouraged to use a heuristic expiration value that is no more than some fraction of the interval since that time.
A typical setting of this fraction might be 10%....

In which case a given cache implementation may invalidate a response which was last modified a week ago after one day, but only invalidate a response that was last modified a month ago after 4 days.

But this still doesn't really answer your question, since heuristic means the cache implementation can do whatever it thinks is best.

Answer 2

Browsers generally follow the IETF spec for HTTP caching. This was introduced in the HTTP 1.1 spec. But they do all vary if the content being served doesn't use an HTTP Cache-Control header. Ultimately you can't rely on the hope that your updated file will be loaded by the client unless you either use a URL cache-buster, as you mentioned, or serve your content with proper cache-control headers.