This is the 5th day of my participation in the August More Text Challenge
preface
As a front-end developer, how to make your page quickly displayed in front of the user is a cliche. Pages need to open in seconds, and to improve the user experience, various caching techniques have to be used. From server-side caches to CDN caches, to browser caches, and finally to some caches at the code level.
Here we are talking about browser caching, and the two words that come to mind are strong caching and negotiated caching. There are a lot of articles on this topic on the web, and I think this article is very comprehensive and should be read regularly.
The server usually tells the browser whether the front-end pages and resources are cached by the browser by setting the HTTP response header. The response header has two pairs of associated headers, HTTP/1.0 Expires and Last-Modified, and HTTP/1.1 cache-Control and Etag.
However, if a request does not set any caching information, does the browser not cache the data at all? Of course not. In special cases, browsers have a default caching policy.
Heuristic cache
If a cacheable request does not set Expires and cache-Control, but the response header has a last-Modified message set, the browser will have a default Cache policy (current time-last-Modified)*0.1, which is called a heuristic Cache.
So far, most browsers have implemented this, but they are slightly different from each other.
Note: The browser’s heuristic caching policy is activated only if the server does not return an explicit caching policy.
Does the heuristic cache cause any problems?
Consider the case where you have a file with no cache time set, and you updated the last version a month ago. With this release, you may have to wait three days for users to see new content. The problem is even worse if the resource is also cached in the CDN.
Therefore, set a reasonable cache time for the resource. Do not set the cache at all, and do not set the cache for too long.