2 min read

HTTP/2

HTTP/2 is a binary protocol, rather than the text-based format used by HTTP/1.1, which allows for more efficient processing of data. It also introduces several new features that improve the performance of web communication, will talk about them later.

In HTTP/2 there is a binary framing layer which is responsible for breaking up messages into smaller, binary-encoded units known as frames that can be transmitted over the TCP connection.

As the request is broken into multiple frames, the frames can be transmitted and processed independently of each other, allowing for parallel processing of multiple streams over the same connection. Each frame has a frame id which helps distinguish the stream to which it belongs.

Header Compression: It uses a more efficient method of compressing headers, which reduces the size of the headers and improves the efficiency of communication.

Stream Prioritization: It allows clients to specify the order in which resources should be loaded, which can improve the perceived performance of a web page.

Multiplexing: HTTP/2 allows multiple requests and responses to be sent over a single TCP connection at the same time, without having to wait for each request to finish before sending the next one. This greatly improves the efficiency of communication and reduces latency.

sequenceDiagram participant Client participant Server Note over Client,Server: Establish Connection Client->>Server: GET index.html (stream1) Server->>Client: 200 OK (stream1) Client->>Server: GET main.css (stream2) Client->>Server: GET main.js (stream3) Server->>Client: 200 OK (stream2) Server->>Client: 200 OK (stream3) Note over Client,Server: Close Connection

The client sends multiple requests to the server over the same TCP connection using multiple streams. Each request is sent in a separate frame, and each frame includes a unique stream identifier

HTTP/2 Requests:
    Stream 1: GET /index.html
    Stream 2: GET /main.css
    Stream 3: GET /main.js

The server receives the requests and processes them in parallel, sending back responses over the same streams. The server can send multiple responses in any order, without having to wait for each request to finish before sending the next one.

HTTP/2 Responses:
    Stream 1: HTML content for /index.html
    Stream 2: CSS content for /main.css
    Stream 3: Image data for /main.js

Server Push: HTTP/2 allows servers to push resources, such as images or style sheets, to the client without the client having to request them explicitly. This can further improve the performance of web pages by reducing the number of round trips required to load a page.

sequenceDiagram participant Client participant Server Note over Client,Server: Establish Connection Client->>Server: GET index.html Server->>Client: 200 OK Server->>Client: main.css (pushed) Server->>Client: main.js (pushed) Note over Client,Server: Close Connection

This feature is not used proactively as it has some caveats, such as increase in network traffic: as the server may push resources that the client does not actually need. This can result in wasted bandwidth and increased load on the network, cache invalidation: as pushed resources may be cached by the client even if they are not needed for subsequent page loads. This can lead to increased cache invalidation and storage requirements on the client.