【发布时间】：2019-03-20 23:35:02
【问题描述】：
或通过 html:
<link href='https://fonts.gstatic.com' rel='preconnect' crossorigin>
在响应内容被解析之前，使用标头是否有速度优势？
【问题讨论】：
标签： pagespeed preconnect
【发布时间】：2019-03-20 23:35:02
【问题描述】：
使用响应标头会稍微快一些，并且可能会导致预连接更快，但我相信这也取决于浏览器的实现和网络条件。
如果您考虑 HTML 响应是如何到达客户端的，它会先查看标头，然后再查看正文。一旦它看到正文，它需要开始解析 HTML 并通过一些标记才能看到您的 <link>。在慢速连接上，在解析标记之前接收到标头后可能会有很大的延迟。
https://web.dev/preconnect-and-dns-prefetch/ 的 Google 开发者网站提到：
在 HTTP 标头中指定预连接提示的一个好处是它不依赖于被解析的标记，并且它可以由对样式表、脚本等的请求触发。例如，Google Fonts 在样式表响应中发送一个 Link 标头，以预连接到托管字体文件的域。
【讨论】：
preconect 的目的是允许浏览器在 HTTP 请求实际发送到服务器之前建立早期连接。这包括 DNS 查找、TLS 协商、TCP 握手。这反过来又消除了往返延迟并为用户节省了时间。
即使在 html 中，您也可以在 head 标签中添加 preconnect 值。如果将它添加到 body 标记中将没有任何意义，因为它只会充当渲染阻塞元素。
【讨论】：
-
问题是关于使用 http 标头。与 html 正文无关。
-
此外，无论放置在何处，预连接链接都不会呈现阻塞。