viewsource和viewparsed_从 view source 说说 http 性能优化

HTTP header 中的 view source

通过 Chrome Network 做资源加载性能分析时，查看 URL 的 HTTP Headers，有的显示 view souce/view parsed 选项，有的却不显示？这什么鬼，顿时有一种知识匮乏的焦虑感，下面两个截图展示了我疑惑。

于是在 SO 上搜索一番，还真找到了同样的问题，可戳此查看，原因也很明确，简而言之就是 HTTP/1.x 版本显示 view source 而 HTTP/2 版本不显示，点开 Response Headers 的 view source 可以看到响应行信息 HTTP/1.1 200 OK， 可以看出确实是 HTTP/1.1 版本。

获取 HTTP 版本号

然而没有 view source 要怎么看到 HTTP 版本信息，已知有两种方法：

chrome 对象的 loadTimes 方法，此方法返回一个对象，其中 npnNegotiatedProtocol 字段代表了请求协议

const pr = window.chrome.loadTimes().npnNegotiatedProtocol;

console.log(pr)

复制代码chrome.loadTimes() is deprecated, instead use standardized API: nextHopProtocol in Navigation Timing 2PerformanceResourceTiming 的接口属性 nextHopProtocol 代表了请求协议