Sobes.tech
Middle

How does the browser determine which resources need to be cached?

sobes.tech AI

Answer from AI

The browser relies on server response HTTP headers:

  • Cache-Control: Defines general caching rules. For example, max-age=<seconds> indicates the resource's lifetime in cache, no-cache requires validation with the server before use, and no-store prohibits caching.

    Cache-Control: max-age=3600, public
    
  • Expires: An outdated header that specifies the exact date and time when the cache expires. It has lower priority than Cache-Control.

    Expires: Tue, 01 Jan 2024 12:00:00 GMT
    
  • ETag (Entity Tag): A unique identifier for the resource version. The browser sends it to the server in the If-None-Match header on subsequent requests. If the ETag matches, the server returns 304 Not Modified.

    ETag: "abcdef123456"
    
  • Last-Modified: The date and time of the last modification of the resource. The browser sends it to the server in the If-Modified-Since header. If the resource has not changed since the specified date, the server returns 304.

    Last-Modified: Mon, 31 Dec 2023 10:00:00 GMT
    

The browser also considers its internal cache, its size, and cleanup policies. If the resource is already in the cache and not expired according to HTTP headers, it is used without making a request to the server. Otherwise, or if validation is required (e.g., with Cache-Control: no-cache or presence of ETag/Last-Modified), the browser makes a request to the server.