如何检查链接[rel = preconnect]是否完成了它的工作？

Question

我在页面的HTML代码中添加了链接[rel = preconnect].但是我如何检查预连接的工作原理？

预连接没有出现在DevTools的网络面板中,我在chrome:// tracing中看不到它.

我可以使用哪些工具来查看此活动？

Answer 1

您可以在https://www.webpagetest.org/创建的瀑布中看到它

下面是一个例子：

请注意，您的网站需要可以在线访问，以便 WebPageTest 能够阅读它。

Answer 2

您可以手动使用 Chrome DevTools 来实现此目的。检查您定义预连接的 URI 的计时选项卡，如果 DNS-Connect-SSL 没有花费时间或者它可以忽略不计（例如 2-5 毫秒），那么您可以认为预连接有效。这里唯一的陷阱是重复测试，当您在浏览器中的连接尚未过期时。