HTTP2的一点浅显理解

如有错误 非常欢迎指正

http2.0 比 1.x 快在哪儿

2.0 性能增强的核心在于全新的二进制分帧层，它定义了如何封装http消息并在客户端和服务端之间传输。
1.x 中以换行符作为分隔符，2.0 将信息分割为更小的消息和帧，并进行二进制编码，再将这些独立的帧交错发送，再另一端重组，解决了1.x中存在的队首阻塞。（无端联想：重组时候是不是使用类似二叉堆的数据结构）
（解决了http的队首阻塞，但TCP层的依然存在）

所有的通信都在一个TCP连接上完成。
1.x中如果客户端要发送多个并行的请求，必须使用多个TCP链接。直接导致TCP链接的效率低。

HTTP的每次通信都会携带header，在1.x中，这些数据都是通过纯文本形式发送的，通常会给每个请求增加500-800字节的负荷，如果算上cookie，负荷会更大。2.0会进行首部压缩。
首部压缩是指在客户端和服务器会使用“首部表”来跟踪之前发送的键值对，对于相同的数据，不再通过每次请求和响应携带。如图

(我傻了吧唧的一开始以为是gzip那种压缩)
在vue后台管理的工程中，封装axios使所有请求携带的token，同时也增大了所有请求，首部压缩完美解决。

http2.0 优化方式有哪些改变

首先不管什么协议，1降低网络延迟，2减少传输数据，这是基础。

在1.x的时代，把多个文件打包成一个以减少请求数量是一个很常用的方式，这种方式就像是使用了http管道，多个数据连在一起，消除了额外的网络延迟，实际就是把管道从传输层提升到了应用层。
这种方式的问题在于打包粒度，以雪碧图为例，工程里的小图打包成了一张，也就意味了如果其中一部分被替换了，用户就需要重新下载整张，在粒度上抠细节可以帮助网页实现递增式加载，但代价是代码的复杂程度（以及无辜的头发），只是权宜之计。在2.0中 就完全可以去掉不必要的打包了。
比如首屏渲染最开始只有一个 home.js ,然后做了骨架屏，拆成了 骨架屏.js + home.js ,想继续拆成 骨架屏.js + 基础交互.js + home.js，但是再拆可能因为额外的请求反而降低性能，在2.0中就不需要犹豫了。

在1.x中，场景是首页有一个单独的小图片，其他页面也有引用，为了首屏加载速度，不知道应该单独请求还是打包进雪碧图。2.0可以使用服务端推送来推送这些资源，直接推送进缓存，就像请求了一样，可以减少一次请求图片的消耗。不过缺点在于服务端推送是以缓存优先的，即缓存和推送同时存在时，使用缓存，而且浪费了这次推送的带宽。（可以通过检查是否携带cookie来判断是否首次访问，只在首次访问进行推送来解决）

在1.x中，可能性能受限于默认的每个来源六个链接而使用了域名分区，在2.0也可以去掉了。