网络世界

1.浏览器会构建HTTP请求编码 2.DNS将域名解析为ip地址，浏览器也会提供DNS缓存，如果之前解析过这个域名，则直接命中缓存 3.先查强缓存，命中直接使用缓存 4.可能经过正向代理、反向代理、负载均衡、源服务器 5.建立TCP连接，会经历三次握手、数据包发送、四次挥手 6.发送http请求，包含请求行、请求头、请求体 7.服务器接收到请求，进行网络响应，返回响应行(HTTP协议版本、状态码和状态描述) 8.最后判断connection字段，如果请求头或响应头包含Connection: Keep-Alive，表示建立长连接，TCP连接会一直保持，否则断开连接

解析算法

1.如果响应头中Content-Type的值是text/html，进行解析和渲染工作 2.构建DOM树，由于浏览器无法直接理解HTML字符串，因此将字节流转换为一种有意义并且方便操作的数据结构，这种数据结构就是DOM树 3.因为HTML是非上下文无关的，所以需要特殊的解析器来完成 4.解析算法分为两步，标记化和建树，标记化可以通过有限状态自动机来完成 5.建树算法，会将DOM对象加入 DOM 树中。还会将对应标记压入存放开放(与闭合标签意思对应)元素的栈中。 6.进行样式计算，浏览器是无法直接识别 CSS 样式文本的，因此渲染引擎接收到 CSS 文本之后第一件事情就是将其转化为一个结构化的对象，即styleSheets。 7.标准化样式，比如em => px , black => #000 8.计算每个节点的样式,每个子节点都会默认继承父节点的样式属性，如果父节点中没有找到，就会采用浏览器默认样式，也叫UserAgent样式。这就是继承规则，非常容易理解。 9.生成布局树，过浏览器的布局系统确定元素的位置，遍历DOM树节点，并把他们添加到布局树中，计算布局树节点的坐标位置。

渲染过程

1.构建图层树，比如进行3D变换的效果，当元素含有层叠上下文时怎样显示或隐藏元素，浏览器在构建完布局树之后，还会对特定的节点进行分层，构建一棵图层树 2.生成绘制列表，渲染引擎会将图层的绘制拆分成一个个绘制指令，按顺序组成绘制列表 3.在渲染进程中，合成线程负责绘制操作，绘制列表准备好了之后，渲染进程的主线程会给合成线程发送commit消息，把绘制列表提交给合成线程。 4.合成线程会将将图层分块，这样会加速首屏显示 5.因为图块上传到GPU内存会比较慢，在首次绘制时会先绘制低分辨率的图片，绘制好后再进行替换 6.合成线程会选择视口附近的图块，把它交给栅格化线程池生成位图，过程中使用GPU进行加速，生成的位图最后发送给合成线程 7.栅格化操作完成后，合成线程会生成一个绘制命令，并发送给浏览器进程 8.浏览器进程把页面内容绘制到内存，也就是生成了页面，然后把这部分内存发送给显卡