页面重定向阶段是否应添加Link rel=preload HTTP响应头？

结论很明确：在302重定向响应里加入rel=preload的Link头是完全合理且有价值的，浏览器会将预加载的资源用于重定向后的目标页面，不会造成不必要的请求浪费。

具体原因： #

• 跨导航复用预加载资源：现代主流浏览器（Chrome、Firefox、Edge等）都支持在重定向响应中处理preload指令，预加载的资源会被存入HTTP缓存或内存缓存。当浏览器跳转到目标页面后，发现需要该资源时，会直接复用已预加载的内容，无需重新发起请求。
• 提前启动请求，节省往返时间：重定向本身会消耗一次网络往返（RTT），如果在重定向响应中就触发预加载，相当于把资源请求的启动时间提前了一个RTT，目标页面加载时，资源可能已经完成下载或正在下载，能显著缩短页面的关键加载路径。
• 不会触发重复请求：即使目标页面也返回了相同的preload头，浏览器会识别到该资源已在预加载队列中，不会发起重复请求，不用担心带宽浪费。

注意事项： #

• 只预加载目标页面确实依赖的关键资源：比如核心样式表、关键JavaScript文件、页面必需的字体，避免预加载非必要资源，否则会占用额外带宽。
• 确保as属性准确匹配资源类型：比如样式文件用as=style，脚本用as=script，错误的as值可能导致浏览器无法正确处理预加载，甚至引发资源加载错误。
• 兼容旧版浏览器：如果需要兼容IE等老旧浏览器，这个优化不会生效，但也不会带来负面影响，可以放心添加。

回到你的示例，在/initial的302响应中加入Link: </static/css/bundle.css>; rel=preload; as=style是非常合理的做法，能让浏览器提前开始下载核心CSS，等用户到达/final页面时，这个资源已经准备就绪，页面渲染速度会明显提升。

内容的提问来源于stack exchange，提问作者Jonathan