本文共 1604 字，大约阅读时间需要 5 分钟。

浏览器端的网络请求过程：

首先，浏览器会构建请求，请求行包括请求方法、路径和HTTP协议版本。 然后查找强缓存，如果命中直接使用，否则进入下一步DNS解析过程。 由于我们输入的是域名，而数据包是通过IP地址传给对方的，因此我们需要得到域名对应的IP地址，这个过程需要依赖一个服务系统，这个系统将域名和 IP 一一映射，这个系统就叫做DNS（域名系统），得到具体 IP 的过程就是DNS解析，浏览器提供了DNS数据缓存功能，即如果一个域名已经解析过，那会把解析的结果缓存下来，下次处理直接走缓存，不需要经过 DNS解析，另外，如果不指定端口的话，默认采用对应的 IP 的 80 端口。 接着建立TCP连接，Chrome 在同一个域名下要求同时最多只能有 6 个 TCP 连接，超过 6 个的话剩下的请求就得等待。假设现在不需要等待，进入了 TCP 连接的建立阶段。TCP（Transmission Control Protocol，传输控制协议）是一种面向连接的、可靠的、基于字节流的传输层通信协议。建立 TCP连接经历了下面三个阶段:  （1）通过三次握手建立客户端和服务器之间的连接，总共发送3个数据包确认已经建立连接。 （2）然后进行数据传输。接收方在接收到数据包后必须要向发送方确认, 如果发送方没有接到这个确认的消息，就判定为数据包丢失，并重新发送该数据包。在发送的过程中还有一个优化策略，就是把大的数据包拆成一个个小包，依次传输到接收方，接收方按照这个小包的顺序把它们组装成完整数据包。 （3）数据传输完成后，通过四次挥手来断开连接。 TCP连接建立完成后，浏览器可以和服务器开始通信，开始发送 HTTP 请求。浏览器发 HTTP 请求包括:请求行、请求头和请求体。请求行由请求方法、请求URI和HTTP版本协议组成。Cache-Control、If-Modified-Since、If-None-Match都由可能被放入请求头中作为缓存的标识信息。请求体只有在POST方法下存在，常见的场景是表单提交。HTTP 请求到达服务器，服务器进行对应的处理。最后要把数据传给浏览器，也就是返回网络响应。网络响应具有三个部分:响应行、响应头和响应体。响应行由HTTP协议版本、状态码和状态描述组成。响应头包含了服务器及其返回数据的一些信息, 服务器生成数据的时间、返回的数据类型以及对即将写入的Cookie信息。响应完成之后，判断Connection字段, 如果请求头或响应头中包含Connection: Keep-Alive，表示建立了持久连接，这样TCP连接会一直保持，之后请求统一站点的资源会复用这个连接。否则断开TCP连接, 请求-响应流程结束。

解析算法部分：

完成了网络请求和响应，如果响应头中Content-Type的值是text/html，浏览器就会进行解析和渲染。解析部分，主要分为构建 DOM树、样式计算以及生成布局树(Layout Tree)。 由于浏览器无法直接理解HTML字符串，因此将这一系列的字节流转换为DOM树的结构。DOM树本质上是一个以document为根节点的多叉树。 CSS样式，一般来源于link标签引用、style标签中的样式以及元素的内嵌style属性。浏览器是无法直接识别 CSS 样式文本的，因此渲染引擎接收到 CSS 文本之后会先将其转化为一个结构化的对象，即styleSheets。样式被格式化和标准化后，通过继承和层叠两个计算规则来计算每个节点的具体样式信息。 DOM树和DOM样式生成之后，通过浏览器的布局系统确定元素的位置，生成一棵布局树。这棵布局树值仅包含可见元素，对于 head标签和设置了display: none的元素，将不会被放入其中。

渲染过程主要包括建立图层树(Layer Tree)、生成绘制列表、生成图块并栅格化、显示器显示内容。

转载地址：https://blog.csdn.net/yyychocolate/article/details/107846946 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！