server push 已被主流浏览器彻底废弃，唯一可行替代方案是 ；必须写对 as 属性（如 as="style"）、路径为绝对路径、置于 最前，并配合 onload 切换 rel 才生效。
Server Push 已被主流浏览器彻底废弃，Link 标签里的 rel="preload" 不是“配合”，而是唯一可行替代方案
Chrome 96+、Firefox 90+、Edge 96+ 全部静默忽略 PUSH_PROMISE 帧——不是配置不对，是协议支持从浏览器端移除了。你在 Nginx 写 http2_push /main.css;，或在 Node.js 用 stream.pushStream()，服务端确实发了帧（Wireshark 能抓到），但浏览器直接丢弃，不进缓存、不触发解析、Network 面板里 Initiator: Push 永远不会出现。
rel="preload" 必须写对 as 属性，否则等于没写
漏写或错写 as 是失效主因：浏览器靠它决定优先级、CORS 策略和缓存复用逻辑。写成 <link rel="preload" href="/main.css">（无 as）会退化为低优先级 fetch 请求，跟没加一样。
-
as="style"→ CSS 下载后可被后续<link rel="stylesheet">复用；不写，相同 URL 也可能重复请求 -
as="font"→ 强制触发 CORS 检查，必须同步加crossorigin，否则字体加载完也不生效 -
as="script"→ 进入 script 缓存池，等真正<script src></script>出现才执行；写成as="fetch"或空着，JS 可能加载两次 -
as="image"→ 仅对<img srcset>匹配有效，对普通<img src>无效
预加载 CSS 后必须手动切换 rel，否则样式不生效
rel="preload" 只下载不解析，写了 <link rel="preload" href="main.css" as="style"> 后，页面仍白屏。不能额外再写一个 <link rel="stylesheet" href="main.css">——路径稍有差异（比如带 query 参数或协议不同）就会触发二次请求。
- 正确写法：
<link rel="preload" href="/main.css" as="style" onload="this.onload=null;this.rel='stylesheet'"> - 必须放在
中，且早于任何可能引用该 CSS 的脚本或样式标签 - 避免对非首屏 CSS 使用，否则抢占带宽，拖慢 FCP
服务端发 Link 响应头和 HTML 里写 link 标签效果等同，但更易出错
用响应头 Link: ; rel=preload; as=style 和 HTML 中写 <link> 标签，浏览器行为一致。但前者容易踩坑：
- 路径必须是绝对路径（
/main.css），相对路径如./main.css会被忽略 - 若部署在子路径（如
/myapp/），href 必须同步改为/myapp/main.css - PHP 或 Express 中输出该 header 时，若没设
Content-Type: text/html，部分浏览器可能不识别 - Nginx 的
http2_push指令 +Link响应头共存时，会多发约 150 字节 PUSH_PROMISE 帧，纯属 TCP 浪费
as、是否在 onload 里及时切换 rel——这些细节没做对，再多的 Link 头也救不了首屏。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
