尝试实现 HTTP2 推送
Trying to implement HTTP2 push
根据我所读的内容(包括一篇 Smashing 杂志文章和一篇 Akamai 文章),实施 HTTP2 服务器推送包括简单地向我网站上的页面添加一个 header 或两个。例如:
Link: </css/styles.css>; rel=preload; as=style
Link: </js/common.js>; rel=preload; as=script
这是准确的吗?真的那么容易吗?
这完全取决于您使用的是什么 Web 服务器 运行 以及它如何实现 HTTP/2 推送(如果有的话)。
例如,使用 Link Headers 适用于 Apache。 Nginx 当前不支持服务器推送。一些 CDN 也使用 Link headers 实现它。
然而,即使它很容易启用,您可能不应该再考虑一下。问题是虽然这可能会加速第一次加载,然后你的 JavaScript 和 CSS 将被缓存(你正在缓存你的资源客户端不是吗?如果不是那么不要'在掌握正确的基础知识之前,甚至不要看 HTTP/2 这样的高级主题)。所以如果你在它已经被缓存时推送它是一种浪费。现在浏览器可以停止推送,如果它不需要那个资源,因为它已经像这个例子中那样拥有它,但这仍然需要时间和精力,而且对于小资源(比如 CSS 或 JavaScript) 当您停止它时,它可能已经下载了很多。
所以您应该只在客户端很有可能需要资源时才推送。 Cache-Digests will be a way for the client to tell the server what resources it has cached, and so help the server to decide whether to push or not, however it's still a work in progress and not away if any browsers supporting it yet. In the meantime I've a simple cookie-based implementation here done in Apache, that might be of interest to you: https://www.tunetheweb.com/performance/http2/http2-push/
根据我所读的内容(包括一篇 Smashing 杂志文章和一篇 Akamai 文章),实施 HTTP2 服务器推送包括简单地向我网站上的页面添加一个 header 或两个。例如:
Link: </css/styles.css>; rel=preload; as=style
Link: </js/common.js>; rel=preload; as=script
这是准确的吗?真的那么容易吗?
这完全取决于您使用的是什么 Web 服务器 运行 以及它如何实现 HTTP/2 推送(如果有的话)。
例如,使用 Link Headers 适用于 Apache。 Nginx 当前不支持服务器推送。一些 CDN 也使用 Link headers 实现它。
然而,即使它很容易启用,您可能不应该再考虑一下。问题是虽然这可能会加速第一次加载,然后你的 JavaScript 和 CSS 将被缓存(你正在缓存你的资源客户端不是吗?如果不是那么不要'在掌握正确的基础知识之前,甚至不要看 HTTP/2 这样的高级主题)。所以如果你在它已经被缓存时推送它是一种浪费。现在浏览器可以停止推送,如果它不需要那个资源,因为它已经像这个例子中那样拥有它,但这仍然需要时间和精力,而且对于小资源(比如 CSS 或 JavaScript) 当您停止它时,它可能已经下载了很多。
所以您应该只在客户端很有可能需要资源时才推送。 Cache-Digests will be a way for the client to tell the server what resources it has cached, and so help the server to decide whether to push or not, however it's still a work in progress and not away if any browsers supporting it yet. In the meantime I've a simple cookie-based implementation here done in Apache, that might be of interest to you: https://www.tunetheweb.com/performance/http2/http2-push/