Interpretation of HTTP1/HTTP2/HTTP3

Compared with HTTP/1.1, HTTP/2 significantly improves the performance of web pages. Just upgrading to this protocol can reduce a lot of previously required performance optimization work. Nevertheless, HTTP/2 is not perfect, HTTP/3 was introduced to solve some of the problems that exist in HTTP/2.

1. Defects of HTTP1.1

• High latency — Head-Of-Line Blocking
• Stateless feature — impediment to interaction
• Plain text transmission — insecurity
• Does not support server push

1.High latency — reduces page loading speed
In recent years, although network bandwidth has grown very fast, we have not seen a corresponding reduction in network latency. The main problem of network latency is due to Head-Of-Line Blocking, which results in bandwidth not being fully utilized.

Head-Of-Line Blocking refers to when a request in a sequentially sent request sequence is blocked for some reason, all requests lined up behind it are also blocked, leading to the client receiving data late. To solve the problem of Head-Of-Line Blocking, people have tried the following methods:

• Distribute resources of the same page to different domain names to increase the connection limit. Chrome has a mechanism that allows six persistent TCP connections to be established simultaneously for the same domain name by default. When using persistent connections, although a TCP pipeline can be shared, only one request can be processed at the same time in one pipeline. Other requests can only be blocked until the current request is finished. Moreover, if there are 10 requests happening simultaneously under the same domain name, then four of the requests will be queued waiting until the ongoing requests are completed.
• Merge small files to reduce the number of resources. Sprite merges multiple small images into a large image, and then “cuts” the small images out again using JavaScript or CSS.
• Inlining resources is another trick to prevent sending many small image requests, embedding the original data of the image in the URL inside the CSS file, reducing the number of network requests.
• Reduce the number of requests. Concatenation…