新增HTTP/1.0, HTTP/1.1， HTTP/2的对比

thinkings/basic-data-structure.md

@@ -104,16 +104,24 @@ React 将`如何确保组件内部hooks保存的状态之间的对应关系`这
 
 ![basic-data-structure-queue-1](../assets/thinkings/basic-data-structure-queue-1.png)
 
-对于同一个tcp连接，http1.1允许一次发送多个http1.1请求，也就是说，不必等前一个响应收到，就可以发送下一个请求，这样就解决了http1.0的客户端的队头阻塞。
-但是，`http1.1规定，服务器端的响应的发送要根据请求被接收的顺序排队`，也就是说，
-先接收到的请求的响应也要先发送。这样造成的问题是，如果最先收到的请求的处理时间长的话，响应生成也慢，就会阻塞已经生成了的响应的发送。也会造成队头阻塞。
+`HTTP/1.0` 和 `HTTP/1.1`:  
+在`HTTP/1.0` 中每一次请求都需要建立一个TCP连接，请求结束后立即断开连接。而且下一个包必须在收到前一个包的ACK之后才能发送。
+在`HTTP/1.1` 中，每一个连接都默认是长连接(persistent connection)。对于同一个tcp连接，允许一次发送多个http1.1请求，也就是说，不必等前一个响应收到，就可以发送下一个请求。这样就解决了http1.0的客户端的队头阻塞，而这也就是`HTTP/1.1`中`管道(Pipeline)`的概念了。
+但是，`http1.1规定，服务器端的响应的发送要根据请求被接收的顺序排队`，也就是说，先接收到的请求的响应也要先发送。这样造成的问题是，如果最先收到的请求的处理时间长的话，响应生成也慢，就会阻塞已经生成了的响应的发送。也会造成队头阻塞。
 可见，http1.1的队首阻塞发生在服务器端。
 
 如果用图来表示的话，过程大概是：
 
 ![basic-data-structure-queue-2](../assets/thinkings/basic-data-structure-queue-2.png)
 
+`HTTP/2` 和 `HTTP/1.1`:  
+
+为了解决`HTTP/1.1`中的服务端队首阻塞，`HTTP/2`采用了`二进制分帧` 和 `多路复用` 等方法。  
+`二进制分帧`中，帧是`HTTP/2`数据通信的最小单位。在`HTTP/1.1`数据包是文本格式，而`HTTP/2`的数据包是二进制格式的，也就是二进制帧。采用帧可以将请求和响应的数据分割得更小，且二进制协议可以更高效解析。`HTTP/2`中，同域名下所有通信都在单个连接上完成，该连接可以承载任意数量的双向数据流。每个数据流都以消息的形式发送，而消息又由一个或多个帧组成。多个帧之间可以乱序发送，根据帧首部的流标识可以重新组装。
+`多路复用`用以替代原来的序列和拥塞机制。在`HTTP/1.1`中，并发多个请求需要多个TCP链接，且单个域名有6-8个TCP链接请求限制。在`HHTP/2`中，同一域名下的所有通信在单个链接完成，仅占用一个TCP链接，且在这一个链接上可以并行请求和响应，互不干扰。
+
 ### 栈
+
 栈也是一种受限的序列，它只能够操作栈顶，不管入栈还是出栈，都是在栈顶操作。
 
 在计算机科学中, 一个 栈(stack) 是一种抽象数据类型,用作表示元素的集合,具有两种主要操作:
@@ -236,11 +244,11 @@ return, children, sibling也都是一个fiber，因此fiber看起来就是一个
 [这篇文章](https://engineering.hexacta.com/didact-fiber-incremental-reconciliation-b2fe028dcaec)也是早期讲述fiber架构的优秀文章
 
 我目前也在写关于《从零开发react系列教程》中关于fiber架构的部分，如果你对具体实现感兴趣，欢迎关注。
-### 非线性结构
+## 非线性结构
 
-那么有了线性结果，我们为什么还需要非线性结果呢？ 答案是为了高效地兼顾静态操作和动态操作。
+那么有了线性结构，我们为什么还需要非线性结构呢？ 答案是为了高效地兼顾静态操作和动态操作。
 大家可以对照各种数据结构的各种操作的复杂度来直观感受一下。
-## 树
+### 树
 树的应用同样非常广泛，小到文件系统，大到因特网，组织架构等都可以表示为树结构，
 而在我们前端眼中比较熟悉的DOM树也是一种树结构，而HTML作为一种DSL去描述这种树结构的具体表现形式。