preconnect 预解析
preconnect 是一种浏览器优化技术，用于告诉浏览器提前与指定的域名建立连接，包括DNS解析、TCP握手和TLS协商（如果适用）。这样做可以减少客户端在请求资源时所需的往返时间（RTT），从而提高页面加载速度。
使用方法
preconnect 通常在HTML文档的 <head> 部分使用 <link> 标签来指定，如下所示：
<link rel="preconnect" href="https://example.com">
这行代码告诉浏览器提前与 example.com 建立连接。
应用场景
- 外部资源：当网页依赖于从不同域名加载的外部资源（如脚本、图片、样式表等）时，使用
preconnect可以提前建立到这些域名的连接，减少加载时间。 - 关键请求：对于那些对页面渲染至关重要的资源，使用
preconnect可以确保尽快获取这些资源。
注意事项
- 资源消耗：虽然
preconnect可以减少页面加载时间，但它也会消耗用户的带宽和浏览器资源。因此，应当仅对关键的外部域使用preconnect。 - 兼容性：大多数现代浏览器都支持
preconnect，但在使用时仍需考虑浏览器兼容性。 - 与其他优化技术的关系：
preconnect与 dns-prefetch、preload和prefetch等其他资源提示技术相辅相成。dns-prefetch仅解析DNS，preload用于提前加载当前页面即将使用的资源，而prefetch用于加载可能在将来某个页面上使用的资源。
示例
假设一个网页需要从多个不同的域名加载资源，可以在文档头部添加 preconnect 指令：
<head><link rel="preconnect" href="https://example.com"><link rel="preconnect" href="https://cdn.example.com"><link rel="preconnect" href="https://api.example.com">
</head>
这样，浏览器会提前与这些域名建立连接，包括DNS解析、TCP握手和TLS协商，当实际请求这些资源时，可以节省相应的时间，加快资源的加载速度。