Http1.0~2 evolution and practice

As the cornerstone protocol of the Internet era, the HTTP protocol has evolved for nearly 30 years. From the original simple text transmission to now supporting various information such as audio, video, text, etc., in order to meet the needs, HTTP has evolved from 1.0 to 2.0. Here is a brief introduction to the advantages and disadvantages of each version of HTTP.

Layered design of HTTP protocol

| OSI seven-layer network model | TCP/IP four-layer conceptual model | Corresponding network protocols |

| --------------- | ------------------ | --------------- |

| Application Layer | Application Layer | HTTP, SMTP, FTP |

| Presentation layer | Application layer | Telnet |

| Session Layer | Application Layer | SMTP, DNS |

| Transport layer | Transport layer | TCP, UDP |

| Network layer | Network layer | IP, ICMP, ARP |

| Data Link Layer | Data Link Layer | Ethernet |

| Physical layer | Data link layer | IEEE 802.1A |

Let’s use an actual network transmission case to explain:

Since the presentation layer and session layer have rarely been mentioned, the user space data transmission between the client and the server is collectively called the application layer, such as the HTTP request in our browser;

HTTP requests need to be transmitted based on the TCP connection of the transport layer, and requests for other protocols may be requested through UDP connections;

TCP connections need to determine the transmission destination through the IP address, which is the network layer;

The IP address needs to be converted into the MAC address of the physical hardware to find the target network card. This is the data link layer;

Network card information needs to be transmitted through various network hardware designs (switches, optical fibers), etc. This is the physical layer;

Http1.0

This is the original HTTP protocol, stateless and connectionless.

• Stateless: The request does not save the state of the client (although other methods can be found through Cookie and Session);

• No connection: This refers to no long connection. Every HTTP request needs to establish a TCP connection. Multiple waves and handshakes are destined to be inefficient;

Http1.1

With the increasing number of requests, frequent waving and handshakes have become a performance bottleneck.

An important optimization idea of ​​Http1.1 is to reuse the same TCP connection for multiple http requests. Specifically, Keep-alive is used to tell the server to keep the TCP connection and not close it. When the client sends two Http requests, such as one requesting a js file and the other requesting a css file, then the two requests will reuse the same TCP connection in order. This is the famous long connection;

However, the two requests are implemented in order. When the first Http request asks for a js file from the server, the second Http request for a css file cannot be executed. You must wait until the first Http request is completely completed before you can continue. Generally speaking, the size of the js file of a website is larger than the css file. For the client, the user retention rate of first obtaining the css file for rendering the page is much better than obtaining the js file first and then slowly loading the css file. But unfortunately, Http requests cannot know the size of the data packets that need to be obtained, so there is another opportunity for optimization here.

In addition, HTTP1.1 also introduces other improvements:

• More request methods: delete, put, option;

• Pipeline mechanism: In the same TCP, the next request can be sent without waiting for the request to end. It seems to be able to solve the above-mentioned Http1.1 problem, but in fact it cannot be implemented due to design problems and is not recommended;

• Introduced Host: the same IP can be deployed on multiple websites, and each website has a different Host;

All in all, the biggest highlight of this generation of HTTP protocol is that multiple HTTP requests can be run on the same TCP, but only one HTTP request can be processed at the same time.

Http2.0

This generation of HTTP protocol has undergone many major updates, which not only compresses the transmission volume, but also provides the ability to multiplex and improve transmission efficiency.

As can be seen from the above figure, Http2.0 can run multiple Http requests on the same TCP connection. It can also run multiple Http requests at the same time, truly realizing the same connection and multiple simultaneous HTTP requests. The main implementation method is to split the request and response data into multiple small frames through binary framing. Each frame has a unique identifier (Stream ID). These frames can be transmitted in parallel on the same connection. This allows clients and servers to utilize bandwidth more efficiently and reduce latency.

To give a specific example, if a website has many pictures, in HTTP 1.0, the picture requests are all in the same TCP connection, but the pictures are displayed one by one, and the subsequent pictures will only wait in circles. Only after the request for the previous picture is completed can the next picture take its turn; in HTTP2, the pictures can be displayed at the same time almost instantly, and there is no waiting relationship.

Multiplexing does not solve the head blocking problem. As can be seen from the above figure, the data packet (stream) is still serial at the TCP level. If stream1 loses packets, TCP's retransmission mechanism will definitely be activated and cause blocking. stream2 and stream3 will wait honestly. This problem can only be solved in HTTP3 (QUIC).

Finally, let’s briefly summarize several features of HTTP2:

1. Multiplexing: Multiple requests and responses can be processed in parallel in the same connection, without establishing a new connection for each request, thus reducing the overhead of connection establishment and closing. **This is also the most important feature of HTTP2! **;

2. Header Compression: Through the HPACK algorithm, Http2.0 compresses the HTTP header, significantly reducing the transmission of redundant data and improving performance;

3. Server Push: The server can actively push resources to the client without the client explicitly requesting them. This mechanism can speed up page loading, especially when multiple resources are required;

4. Binary protocol: Http2.0 uses binary format instead of text format, which not only improves the parsing speed, but also reduces the possibility of errors. The binary format makes the protocol more concise and efficient;

Comparison of advantages and disadvantages

• HTTP1

  • Head-of-line blocking

  • Low transmission efficiency

  • Clear text transmission is not safe

• HTTP2

  • Multiplexing: multiple HTTP requests reuse the same TCP connection

  • Head compression

  • Binary protocol

nginx configuration Http2.0

server{


        listen 443 ssl http2;


        server_name we1.top www.we1.top;





        ssl_certificate /etc/letsencrypt/live/we1.top/fullchain.pem;


        ssl_certificate_key /etc/letsencrypt/live/we1.top/privkey.pem;





        location/{


                proxy_pass http://blog;





                proxy_http_version 1.1;


                proxy_set_header Host $host;


                proxy_set_header X-Real-IP $remote_addr;


                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;


                proxy_set_header X-Forwarded-Proto $scheme;


                proxy_read_timeout 90;


        }


}

By turning on Http2.0, the browsing speed of this blog system has been significantly improved compared to before.