Shulou(Shulou.com)06/03 Report--

Today, I will talk to you about how to achieve HTTP/2 server push in Node.js. Many people may not know much about it. In order to make you understand better, the editor has summarized the following content for you. I hope you can get something according to this article.

The recent release of Node.js v8.4 + has brought an experimental version of HTTP/2, which you can start by setting the parameter-expose-http2.

About HTTP/2

The purpose of HTTP/2 is to reduce latency by supporting complete request and response multiplexing, minimize protocol overhead by effectively compressing HTTP header fields, and increase support for request priority and server push.

For more information about HTTP/2, see the article HTTP/2.

Server push

HTTP/2 server push (Server Push) allows the server to send resources to the browser before the browser requests it.

Before we go to HTTP/2, let's take a look at how it works with HTTP/1:

In HTTP/1, the client sends a request to the server, and the server returns an HTML file that contains links to many external resources (.js, .css, and so on). When the browser processes the initial HTML file, it begins to parse the links and load them separately.

View the image of the demo loading process below. Note the separate requests on the schedule and the initiation of these requests:

HTTP/1 resource loading

This is how HTTP/1 works, and this is how we develop applications for so many years. Why change it?

The problem with the current approach is that the user must wait for the browser to parse the response, find the link, and get the resource. This delays rendering and increases loading time. There are some solutions, such as inlining some resources, but also make the initial response larger and larger.

This is where the HTTP/2 server push feature comes into view because the server can send resources to the browser before the browser requests it.

Take a look at the picture below for a website that provides the same service through HTTP/2. View the Timeline and initiator. You can see that HTTP/2 reuse reduces the number of requests, and resources are sent immediately with the initial request.

HTTP/2 server push

Let's take a look at how to use HTTP/2 server push in Node.js today to speed up client load time.

A case of Node.js HTTP/2 server push

By loading the built-in http2 module, we can create our server, just as we do with the https module.

The interesting part is to push other resources when requesting an index.html:

Const http2 = require ('http2') const server = http2.createSecureServer ({cert, key}, onRequest) function push (stream, filePath) {const {file, headers} = getFile (filePath) const pushHeaders = {[HTTP2_HEADER_PATH]: filePath} stream.pushStream (pushHeaders, (pushStream) = > {pushStream.respondWithFD (file, headers)}) function onRequest (req, res) {/ / Push files with index.html if (reqPath = =' / index.html') {push (res.stream) 'bundle1.js') push (res.stream,' bundle2.js')} / / Serve file res.stream.respondWithFD (file.fileDescriptor, file.headers)}

In this way, bundle1.js and bundle2.js resources are sent to the browser even before it requires them.

You can view the complete case: https://github.com/RisingStack/http2-push-example

HTTP/2 & Node

HTTP/2 can help us optimize the communication between our client and server in many ways.

Through server push, we can send resources to the browser, reducing the user's initial loading time.

After reading the above, do you have any further understanding of how to implement HTTP/2 server push in Node.js? If you want to know more knowledge or related content, please follow the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.