Node.js can HTTP/2 push!

HTTP/2 is a major revision of the HTTP protocol that improves web performance by introducing new features such as server push, binary framing, and header compression. One of the most exciting features of HTTP/2 is server push, which allows servers to proactively send resources to clients before they request them.

In this article, we will explore how Node.js can take advantage of server push in HTTP/2 to improve website performance.

How Server Push Works

In HTTP/1.x, each resource on a webpage must be requested individually, which can lead to slow load times and increase latency. With HTTP/2, server push allows the server to send additional resources to the client before they are requested. This means that the client can receive all of the resources it needs to render the page faster and more efficiently.

Server push works by allowing the server to send additional resources along with the main HTML file in response to a single request. For example, if the client requests an HTML file, the server can also send images, stylesheets, and javascript files in the same response. The server provides hints to the client about which resources should be pushed based on the structure of the HTML document.

Using HTTP/2 Server Push with Node.js

Node.js has excellent support for HTTP/2 and can take advantage of the server push feature. To use server push, we need to create an HTTP/2 server and then add code to push resources to the client.

Here's an example of how to create an HTTP/2 server in Node.js:

----- ----- - -----------------
----- -- - --------------

----- ------- - -
  ---- ------------------------------
  ----- -----------------------------
--

----- ------ - --------------------------------- ----- ---- -- -
  ----- ------ - -----------
  ----- --------- - -------------- --------------

  -- -------- --- ---- -
    ---------------------------- ---------------- ----------------------------
    --------------------------- --------------
    ------------------ -------------------------------------------

    -- ---- ----- -- --- ------
    ------------------------ -- -
      ----- -------- - --------- - -----
      ----- ---------- - ------------------------------
      --------------------------- ------ ----- ----------- -- -
        -- ----- ----- ----
        ----------------------------
      ---
    ---

    ----------
  - ---- -
    -------------------
    ----------
  -
---

--------------------

In this example, we're creating an HTTP/2 server and serving an HTML file with some CSS and JavaScript resources. We're also pushing two additional resources to the client using the stream.pushStream() method.

When a client requests the main HTML file, the server sends the HTML file along with the CSS and JavaScript files in the same response. The server also provides hints to the client to request the CSS and JavaScript files from its cache for subsequent loads.

By pushing resources to the client ahead of time, we can improve website performance and reduce latency.

Conclusion

HTTP/2 server push is a powerful feature that can significantly improve website performance. With Node.js, we can easily take advantage of this feature by creating an HTTP/2 server and pushing resources to the client.

By leveraging HTTP/2 server push in our applications, we can provide a faster and more efficient user experience for our users.

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/29116


猜你喜欢

  • 为什么Number.MAX_SAFE_INTEGER是9007199254740991而不是9007199254740992?

    在 JavaScript 中,Number.MAX_SAFE_INTEGER 是一个常量,它代表了能够以精确方式表示的最大整数。然而,这个值为什么是 9,007,199,254,740,991 而不是...

    7 年前
  • ES6 JavaScript 中的 @@ ("at at") 是什么意思?

    在 ES6 中,有一种特殊的符号叫做 @@ 符号,也被称为 “at at” 符号。它是 JavaScript 中一个非常重要的概念,可以用于创建和使用内置对象的特殊方法。

    7 年前
  • Testing Javascript that Manipulates the DOM

    在前端开发中,JavaScript 经常被用来操纵 DOM。然而,这样的代码往往比较难以测试,因为它们依赖于浏览器环境和用户交互。在本文中,我们将讨论一些测试 JavaScript 操作 DOM 的最...

    7 年前
  • JavaScript/CSS 动画:从 DOM 节点到 DOM 节点

    在前端开发中,动画效果是提升用户体验的重要手段之一。本文将介绍如何使用 JavaScript 和 CSS 实现从一个 DOM 节点到另一个 DOM 节点的动画效果。

    7 年前
  • innerText/textContent vs. 检索每个文本节点

    当我们需要在前端操作 DOM 元素的文本内容时,innerText 和 textContent 是两个常用的属性。另一种方式是检索每个文本节点并手动处理它们的文本内容。

    7 年前
  • HTML5 Boilerplate plugins.js

    casperOneMatrym提出了一个问题:HTML5 Boilerplate plugins.js,或许与您遇到的问题类似。 回答者borkweb给出了该问题的处理方式: That section...

    7 年前
  • JavaScript 相等性传递很奇怪

    在 JavaScript 中,相等性运算符(== 和 ===)可能会让你感到困惑。这是因为它们的传递性不像你预期的那样简单和自然。在本文中,我们将深入了解这个问题,并为您提供一些指导意义和示例代码。

    7 年前
  • JavaScript 多线程编程

    在前端开发中,JavaScript 是一门单线程语言,这意味着它只能同时处理一件事情。但是,在现代网络应用程序中,我们经常需要并行执行多个任务以提高性能和用户体验。

    7 年前
  • TypeScript: 编译移除未引用的导入

    在前端开发中,我们经常使用TypeScript来增强JavaScript代码的类型安全性和可维护性。不过在编写TypeScript代码时,也经常会出现引入了但未被使用的导入情况。

    7 年前
  • Math.min.apply(0, array) - 为什么要这样使用?

    在前端开发中,我们经常需要比较一组数据的最小值或最大值。通常我们会使用 Math.min() 或 Math.max() 来完成这个任务。然而,在处理数组时,我们需要将数组元素作为参数传递给 Math....

    7 年前
  • D3.js:使用元素位置而非鼠标位置定位工具提示

    D3.js 是一个流行的 JavaScript 数据可视化库。在数据可视化中,工具提示通常用于显示与特定数据点相关的信息。默认情况下,D3.js 工具提示根据鼠标的位置来定位,但是这种方式可能会导致工...

    7 年前
  • Javascript getElementById查找 - 哈希映射还是递归树遍历?

    在前端开发中,我们经常需要使用getElementById函数来查找DOM元素。但是,在大型或复杂的DOM结构中,这个函数的性能可能会变得很慢。因此,我们需要考虑如何优化它的查找算法。

    7 年前
  • WebSockets的缺陷

    WebSockets是一种在浏览器和服务器之间创建持久化连接的通信协议。虽然它提供了实时数据传输的能力,但是它也存在一些缺点。 1. 流量消耗 使用WebSockets的一个主要问题是流量消耗。

    7 年前
  • jQuery密码强度检查器

    在Web应用程序中,密码是保护用户账户安全的重要组成部分。然而,用户通常会使用弱密码,这会使他们的帐户更容易受到攻击。因此,在注册或更改密码时,向用户提供一个密码强度检查器可以鼓励他们选择更强的密码。

    7 年前
  • 如何在 Aptana 中去除黑色背景,恢复正常的白色背景?

    Aptana Studio 是一款基于 Eclipse 平台的前端开发工具,它默认采用黑色背景,这对一些人来说可能不太友好。本文将介绍如何通过简单的操作,实现从黑色背景恢复到正常的白色背景。

    7 年前
  • 如何在 Node.js 沙盒中安全地运行用户提交的脚本?

    Node.js 是一种非常强大的开发语言,能够用于编写 Web 应用程序、命令行工具等。然而,当我们允许用户向我们的应用程序提交脚本时,我们需要确保这些脚本不会对系统造成损害或泄漏敏感信息。

    7 年前
  • Why is Function.prototype.bind slow?

    Raynos提出了一个问题:Why is Function.prototype.bind slow?,或许与您遇到的问题类似。 回答者Domenic给出了该问题的处理方式: Based on http...

    7 年前
  • 如何在警告框或确认框中加粗文本?

    在前端开发中,警告框和确认框通常用于向用户显示重要信息。有时候你可能想要将某些文本加粗以突出强调其重要性,但是默认情况下这些框中的文本并不支持加粗。那么,该如何在警告框或确认框中加粗文本呢?接下来我们...

    7 年前
  • 在同一个页面中同时使用 JQuery 和 Prototype

    前端开发中,我们经常需要使用不同的 JavaScript 库来实现不同的功能。其中,两个最常用的库就是 JQuery 和 Prototype。然而,当我们在同一个页面中同时使用这两个库时,可能会出现一...

    7 年前
  • Extending Object.prototype JavaScript

    在JavaScript中,Object是所有对象的基类。它提供了许多有用的方法和属性,如toString()和hasOwnProperty()等。但是,我们可以通过扩展Object.prototype...

    7 年前

相关推荐

    暂无文章