HTTP/2 Server Push 在现代浏览器中已失效，Chrome 96+、Firefox 90+、Edge 96+ 均静默忽略 http2_push 指令和 Link 响应头；Wireshark 可捕获 PUSH_PROMISE 帧但浏览器内核跳过解析，Network 面板无 Initiator: Push；rel="preload" 是唯一可行替代方案，需置于 <head> 中、早于对应资源标签、正确设置 as 属性；Nginx 的 http2_push 仅增加无效帧开销；应删除 Server Push 配置，转而内联关键 CSS、合理使用 preload、defer、TLS 1.3、Brotli 等真实有效优化。
HTTP/2 Server Push 在现代浏览器中已失效，不是配置问题，是协议支持被移除——Chrome 96+、Firefox 90+、Edge 96+ 均静默忽略 http2_push 指令和 Link 响应头，真实加载链路未节省任何 RTT。
为什么你看到的“Push 成功”都是假象
Wireshark 能抓到 PUSH_PROMISE 帧，chrome://net-internals/#http2 仍显示日志，但这只是服务器单方面发送；浏览器内核早已跳过解析、不进缓存、不触发加载。
- Network 面板里永远看不到
Initiator: Push - 所有“推送”的 CSS/JS 仍需 HTML 解析后发起独立
GET请求 -
Lighthouse若提示“启用 Server Push”，说明其规则库未更新（截至 2026 年 5 月）
rel="preload" 是唯一可行的替代方案
它由浏览器自主调度，兼容全部主流版本，语义明确、可中断、可缓存。关键不是“怎么写”，而是“怎么用对”：
- 必须放在
<head>中，且早于对应<link rel="stylesheet">或<script> -
as属性不可省：<link rel="preload" as="style" href="/main.css">，否则按as="fetch"处理，不参与样式解析流程 - 避免对
defer或type="module"脚本预加载，除非后续<script>明确复用同一 URL - 非首屏图片、字体以外的资源慎用，否则抢占带宽，拖慢
FCP
Nginx 配置 http2_push 的真实开销
不是“不起作用”，而是产生确定的负面成本：
-
http2_push /main.css;会多发约 150 字节PUSH_PROMISE帧，纯属 TCP 浪费 - PHP 输出
header('Link: </main.css>; rel=preload; as=style');—— 浏览器收到后丢弃，无日志、无警告、无 fallback - Node.js 使用
stream.pushStream()发送资源，客户端 stream 状态为idle，数据直接被内核丢弃
真正影响首屏速度的关键点
Server Push 不是调优项，是历史遗留配置。该删就删，把精力放在这些实打实有效的动作上：
立即学习“前端免费学习笔记（深入）”；
- 内联首屏关键 CSS（
<style></style>），确保FCP不阻塞 - 用
rel="preload"加载字体、首屏图片等高价值静态资源 - 对非关键 JS 使用
defer或type="module" - 确认 TLS 1.3、OCSP stapling、Brotli 压缩已启用
复杂点在于：资源依赖关系必须靠人工或构建时分析确定，浏览器不帮你猜；preload 的 as 值写错，效果就归零——这点容易被忽略。
