能，但仅对HTTPS域名生效，且必须满足href为完整HTTPS地址、带crossorigin属性、置于<head>最顶部三个条件，浏览器会立即触发DNS→TCP→TLS全流程，若域名已有有效TLS缓存则跳过，属正常优化。
preconnect 能不能真正提前走完 TLS 握手？
能，但只对 HTTPS 域名生效，且必须满足三个硬条件：href 是完整 HTTPS 地址、crossorigin 属性存在、标签位于 <head> 最顶部。浏览器遇到它会立刻触发 DNS → TCP → TLS 全流程，不是“准备连接”，而是实打实完成握手。如果目标域名已有有效 TLS 会话缓存（比如用户刚访问过同域名其他页），这步会被跳过——这是优化，不是失效。
为什么加了 preconnect 却没看到 SSL 时间下降？
最常见原因是预连接和真实请求不匹配，导致连接无法复用。浏览器建的连接带凭据标记，后续请求必须严格对齐：
-
href写成http://api.example.com，但 JS 实际 fetch 的是https://api.example.com→ 协议不一致，连接丢弃 - 漏掉
crossorigin，而字体或 API 请求实际需要 CORS → 浏览器建的是“无凭据连接”，fetch 时仍要重连 -
href带路径，比如https://cdn.example.com/main.js→ 整个<link>被忽略，Network 面板里根本看不到记录 - 放在
<link rel="stylesheet">后面 → 解析器已进入资源加载阶段，空闲窗口关闭
crossorigin 属性到底要不要加？怎么写才合法？
不是可选项，是复用开关。是否加，取决于你后续真实请求是否需要 CORS 权限：
- 必须加：
https://fonts.googleapis.com、https://fonts.gstatic.com（字体文件强制 CORS）、https://api.example.com（服务端返回Access-Control-Allow-Origin） - 可不加：纯静态 CDN 如
https://cdn.jsdelivr.net，且你没用credentials: 'include'发起请求 - 写法只能是
crossorigin或crossorigin="anonymous"；crossorigin=""是非法 HTML，会被浏览器忽略 - 如果 fetch 显式传了
credentials: 'include'，服务端需返回Access-Control-Allow-Credentials: true，此时仍要保留crossorigin，但不能用anonymous模式
最多能加几个？哪些域名值得加？
Chrome 硬性限制最多同时处理 6 个 preconnect，再多的标签会被排队甚至丢弃。每个连接还占用 DNS 缓存槽位和 TLS 会话票证内存：
立即学习“前端免费学习笔记（深入）”；
- 优先保首屏强依赖的第三方域名：如
https://fonts.gstatic.com、https://cdn.example.com、https://api.example.com - 成对使用：Google Fonts 必须同时声明
https://fonts.googleapis.com和https://fonts.gstatic.com - 别为同源域名加：
https://your-site.com加了也无效，浏览器自动复用已有连接 - 别为广告/统计/分享等非首屏立即触发的域名加——更适合用
<link rel="dns-prefetch">
