一个浏览器是如何工作的？

1. 过程

1. 浏览器首先使用 HTTP 协议 或者 HTTPS 协议，向服务端请求页面。

2. 把请求回来的 HTML 代码经过解析，构建成 DOM 树。

3. 计算 DOM 上的属性。

4. 最后根据 CSS 属性对元素逐个进行渲染，得到内存中的位图。

5. 一个可选的步骤是对位图进行合成，这会极大地增加后续绘制的速度。

6. 合成之后，再绘制到界面上。

   

2. HTTP 协议

HTTP 协议是基于 TCP 出现的，TCP 协议是一条双向的通道，HTTP 在 TCP 的基础上，规定了 Request - Response 的模式。这个模式决定了通讯必定是由浏览器端首先发起的。

大部分情况下，浏览器的实现者只需要一个 TCP 库，甚至一个现成的 HTTP 库就可以搞定浏览器的网络通讯部分。HTTP是纯粹的文本协议，它是规定了使用 TCP 协议来传输文本格式的一个应用处协议。

• HTTP1.1 https://tools.ietf.org/html/rfc2616
• HTTP1.1 https://tools.ietf.org/html/rfc7234

3. HTTP 协议格式

request line | response line + headers + body

4. HTTP Method（方法）(REST)

• GET
• POST
• HEAD
• PUT
• DELETE
• CONNECT
• OPTIONS
• TRACE

5. HTTP Status code（状态码）和 状态文本。

• 1xx：临时回应，表示客户端请继续

• 2xx：请求成功

  • 200：最喜欢的

• 3xx：表示请求的目标有变化，希望客户端进一步处理

  • 301 && 302: 永久性与临时性跳转。
  • 304： 客户端缓存没有更新

• 4xx：客户端请求错误

  • 403：无权限
  • 404：页面不存在
  • 419：xxxxxx茶壶

• 5xx：服务端请求错误

  • 500：服务端错误
  • 503：服务端暂时性错误，可以过一会人再试

  对于前段，1xx基本遇不到，原因是1xx 状态被浏览器 HTTP库直接处理掉了，不会让上层应用知晓。

  2xx 系列的的 200，请求成功

  3xx 系列，301 表示永久转移，告诉用户以后别再来这个 url 了，302 表示暂时性转移，以后资源还会回来。

  304 ，前端必会的一个状态码。产生这个状态码的前提是，客户端本地有了缓存，并且在 Request 中告诉了服务端，当服务器通过时间或者 tag ，发现没有更新的时候，就会返回一个不含 body 的 304 状态

6. HTTP Head（HTTP 头）

7. HTTPS

在基于 HTTP 的基础上使用了加密通道来传输，保证了网页数据传输的安全性。

HTTPS 是使用加密通道来传输 HTTP 的内容。但是 HTTPS 首先与服务端建立一条 TLS 加密通道。TLS 构建于 TCP 协议之上，它实际上是对传输的内容做一次加密，所以从传输内容上看，HTTPS 跟 HTTP 没有任何区别。

8.HTTP2

HTTP 2 是 HTTP 1.1 的升级版本。

HTTP 2.0 最大的改进有两点，一是支持服务端推送，二是支持 TCP 连接复用。

服务端推送能够在客户端发送第一个请求到服务端时，提前把一部分内容推送给客户端，放入缓存当中，这可以避免客户端请求顺序带来的并行度不高，从而导致的性能问题。

TCP 连接复用，则使用同一个 TCP 连接来传输多个 HTTP 请求，避免了 TCP 连接建立时的三次握手开销，和初建 TCP 连接时传输窗口小的问题。

Note: 其实很多优化涉及更下层的协议。IP 层的分包情况，和物理层的建连时间是需要被考虑的。