Im /post/684490…

preface

Caching mechanisms are ubiquitous, such as client caching, server caching, proxy server caching, and so on. The caching feature in HTTP is the browser cache.

HTTP caching, as an important means of web performance optimization, is of great significance to people engaged in Web development. This article will organize the HTTP cache around the following aspects:

  1. Rules for caching
  2. Caching scheme
  3. Benefits of caching
  4. The execution of requests for different refreshes

Rules for caching

We know that HTTP caches belong to client caches, and we’ll see why later. So we assume that browsers have a cache database for static files (images, CSS, JS, etc.) that don’t change very often. We divide caches into forced caches and negotiated caches. I will describe the caching rules for each of these caches in detail.

Mandatory cache

When the requested data is already in the cache database. The client retrieves data directly from the cached database. The client obtains the data from the server only when the requested data is not in the cache database.

Negotiate the cache

Also known as contrast the cache, the client will be obtained from the cache database to a cached data identification, after get id request to the server to investigate whether failure (fresh), if there is no failure server will return 304, at this time the client directly from the cache access to the requested data, if failure, the server will return the updated data.

Tip:

The two types of caching mechanisms can exist at the same time. The forced cache has a higher priority than the negotiated cache. When the forced cache is executed, if the cached data is matched, the cached database data is directly used instead of cache negotiation.

Caching scheme

This gives you an idea of how caching works, but how does the server know if the cache is invalid? We know that when the browser interacts with the server, it sends request data and response data, which we call HTTP packets. A packet contains the header and the body. The cache-related rule information is contained in the header. The content in the BOby is the part of the HTTP request that is actually transmitted. An example of an HTTP packet header is as follows:

Next, we will explain the cache rule related information that appears in HTTP packets. (Again, we’ll break it down into forced caching and negotiated caching.)

Mandatory cache

For mandatory caching, there are two fields in the server response header to indicate this — Expires and cache-control.

The Expires Exprires value indicates the expiration time of the data returned by the server. When the request time is less than the time returned when the request is made again, the cached data is used directly. However, because the server time and the client time can be out of sync, this can lead to a Cache hit error. On the other hand, Expires is a product of HTTP1.0, so most use cache-control instead.

Cache-control Cache-control has many properties, each of which means different things. Max-age =t: The cached data becomes invalid after T seconds. No-cache: The negotiated cache is required to verify the cached data. No-store: All content is not cached.

Negotiate the cache

The negotiation cache must be compared to determine whether the cache can be used. The first time a browser requests data, the server responds with cache identifiers and data to the client, which backs them up to the cache. On the next request, the client sends the identifier from the cache to the server, and the server determines based on this identifier. If not, the 304 status code is returned, which allows the browser to use the cached data directly. For negotiated caches, the cache identifier is important to understand, and we will focus on its two caching schemes.

Last-Modified

Last-modified: When the server responds to a request, it tells the browser when the resource was Last Modified. If-modified-since: When the browser requests the server again, the request header contains this field, followed by the last modification time obtained in the cache. The server receives the request with the existing IF-modified-since and compares it with the last Modified time of the requested resource. If it is consistent, it returns 304 and the response header, and the browser simply retrieves the information from the cache. This means, literally, whether the file has been modified since a certain point in time

If it has been Modified: then start transferring the response as a whole and the server returns: 200 OK. If it has Not been Modified: then just transfer the response header and the server returns: 304 Not Modified

If-unmodified-since: Literally: whether the file has not been modified Since a certain point in time

The server returns: 200 OK. If the file is modified: no transfer. The server returns: 412 Precondition failed

The difference between the two is that one is downloaded with changes and the other is downloaded without changes. Last-modified is good, but not particularly good, because if a resource is Modified on the server, but its actual contents haven’t changed at all, the entire entity will be returned to the client because the last-modified time doesn’t match (even if the client has an identical resource in the cache). To solve this problem, HTTP1.1 introduced Etag.

Etag: indicates the unique identifier of the current resource generated by the server when the server responds to a request. (The generation rule is determined by the server.) if-none-match: Indicates the unique identifier of the current resource generated by the server when the browser requests the server again. After receiving the packet, the server finds if-none-match and compares it with the unique identifier of the requested resource.

If no, the resource has been changed. The system responds to the entire resource content and returns status code 200. Similarly, if the resource is not modified, the browser responds to the header and directly obtains data information from the cache. Return status code 304.

However, in practical applications, Etag is calculated by using an algorithm, and the algorithm will occupy the server computing resources. All the server resources are precious, so Etag is rarely used.

Benefits of caching

It reduces redundant data transfer, saves broadband traffic and reduces the burden on the server, greatly improves the performance of the web site and speeds up the loading of web pages on the client side which is why THE HTTP cache is a client cache.

The execution of requests for different refreshes

Write URL in the browser address bar and press Enter

The browser finds the file in the cache, so it doesn’t need to continue the request, it goes directly to the cache. (the) fastest

F5

F5 is to tell the browser, don’t be lazy, at least go to the server to see if the file has expired. So the browser boldly sends a request with if-modify-since.

Ctrl+F5

Tell the browser, you first in your cache of this file for me to delete, and then go to the server to request a complete resource file down. The client is then done forcing the update.