浏览器工作原理1
浏览器工作原理1：
首先浏览器是如何工作的，实际上对于浏览器的实现者来说就是把一个网址或者链接变成一个显示在屏幕上的网页，而这个过程是这样的：
1.浏览器首先使用HTTP协议或者HTTPS协议，向服务器请问页面；
2.把请求回来的HTML代码经过解析，构建成DOM树。
3.计算DOM树上的CSS属性。
4.最后根据CSS属性对元素逐个进行渲染，得到内存中的位图。
5.一个可选的步骤是对位图进行合成，这会极大的增加后续绘制的速度。
6.和成之后，在绘制到界面上。
首先我们需要建立一个认知，就是从HTTP请求回来开始，这个过程并非一般想象中的一步做完在做下一步，而是一条流水线，从HTTP请求回来，就产生了流式的数据，后续的DOM树构建、CSS计算、渲染、合成、绘制，都是尽可能的流式处理前一步的产出：即不需要等到上一步骤完全结束，就开始处理上一步的输出，这样我们在浏览网页的时候，才会看到逐步出现的页面。
首先介绍HTTP协议：
HTTP是一个客户端终端（用户）和服务器端（网站）请求和应答的标准（TCP）。通过使用网页浏览器、网络爬虫或者其它的工具，客户端发起一个HTTP请求到服务器上指定端口（默认端口为80）。我们称这个客户端为用户代理程序（user agent）。应答的服务器上存储着一些资源，比如HTML文件和图像。我们称这个应答服务器为源服务器（origin server）。在用户代理和源服务器中间可能存在多个“中间层”，比如代理服务器、网关或者隧道（tunnel）。通常，由HTTP客户端发起一个请求，创建一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端的请求。一旦收到请求，服务器会向客户端返回一个状态，比如"HTTP/1.1 200 OK"，以及返回的内容，如请求的文件、错误消息、或者其它信息。
HTTP请求方法：
定义了以下几种：GET、POST、HEAD、PUT、DELETE、CONNECT、OPTIONS、TRACE。
一般比较常用的就是GET和POST。浏览器通过地址栏访问页面都是 GET 方法。表单提交产生 POST 方法。
HEAD 则是跟 GET 类似，只返回响应头，多数由 JavaScript 发起。
PUT 和 DELETE 分别表示添加资源和删除资源，但是实际上这只是语义上的一种约定，并没有强约束。
CONNECT 现在多用于 HTTPS 和 WebSocket。
OPTIONS 和 TRACE 一般用于调试，多数线上服务都不支持。
HTTP Status code（状态码）和 Status text（状态文本）：
常见的有以下几种：
1XX: 临时回应，表示客户端请继续。
2XX: 请求成功。常见的有200，表示请求成功。
3XX: 表示请求的目标有变化，希望客户端进一步处理，常见的有301&302表示永久性与临时跳转，304表示跟客户端缓存
没有更新。
4XX: 客户端请求错误。常见的有 403表示无权限，404表示请求的页面不存在。
5XX: 服务器端请求错误。常见的有500表示服务端错误，503表示服务端暂时性错误，可以一会再试。
对于我们来说1开头的状态码是非常陌生的，原因是1开头的状态码被浏览器HTTP库直接处理掉了，不会让上层应用知晓。2开头的最常见了，成功的表示。四开头的就更常见了，通常是代码写错了就会显示。
HTTPS协议：
这个协议是在HTTP的基础上，HTTPS规定了更复杂的内容，但是它基本保持了HTTP的设计思想。HTTPS有两个作用：一是确定请求的目标服务端身份，二是保证传输的数据不会被网络中间的节点窃听或者篡改。HTTPS是通过SSL加密通道来传输HTTP的内容。HTTPS的安全基础是SSL，因此加密的详细内容就需要SSL。但是HTTPS首先与服务端建立一条TLS加密通道。TLS构建于TCP协议上，它实际上是对传输的内容做一次加密，所以从传输的内容上看，HTTPS跟HTTP没有任何区别。