HTTP请求过程HTTP是一种允许浏览器从服务器获取资源的协议,是Web的基础。浏览器发起一个HTTP请求流程来构造一个请求。首先,浏览器构造请求行信息。构建完成后,浏览器准备发起网络请求。查找缓存在真正发起网络请求之前,浏览器会先在浏览器中检查是否有文件可以请求。如果缓存查找失败,则进入网络请求流程。好处:减轻服务器压力,提高性能(获取资源所需时间更少)。对于网站来说,缓存是资源快速加载的重要一环。准备IP和端口第一步,浏览器会请求DNS返回域名对应的IP。如果域名已经被解析,浏览器会将解析结果缓存起来,以供下次使用。获取到IP之后,接下来就是获取端口号了。通常不指定端口号,所以HTTP协议默认80端口。等待TCP队列同一个域名最多可以同时建立6个TCP连接。建立TCP连接的队列结束后,终于可以和服务器握手了。-TCP连接发送HTTP请求。首先,浏览器会向服务器发送请求行,包括请求方法、请求URL、HTTP版本。如果协议是POST方法,浏览器还准备发送到服务器的数据。这里准备的数据是通过请求体发送的。在请求行之后,需要发送一个请求头来携带浏览器的所有基本信息。服务器端处理HTTP请求并返回请求,首先返回响应行,包括协议版本和状态码,然后服务器会返回相应的响应头。包含有关服务器本身的信息。发送响应头后,服务器可以继续发送响应体数据。断开通常情况下,一旦服务器向客户端返回请求数据,它就会关闭TCP连接。如果浏览器或服务器在头部信息中加入Connection:keep-Alive,则TCP连接在发送后会保持打开状态。重定向响应行的状态代码为301,告诉浏览器重定向到另一个URL。要重定向的URL包含在响应标头的Location字段中。导航过程从用户发送URL请求到页面解析的过程称为导航。从输入URL到显示页面,用户在卸载URL请求过程之前进入浏览器判断是搜索内容还是请求的URL。浏览器通过进程间通信(IPC)将URL内容发送给网络进程。,HTTPS建立TSL连接]构造请求重定向在导航过程中,如果服务器响应行的状态码中包含301、302等跳转信息,浏览器将跳转到新地址继续导航;如果响应行的状态码为200,则表示浏览器可以继续处理请求。响应数据类型处理Content-Type是HTTP中非常重要的一个字段。它告诉浏览器服务器返回的响应体数据是什么类型,然后浏览器根据Content-Type的值决定如何显示响应体的内容。如果是下载类型,则将请求提交给下载管理器,同时结束对该URL的导航过程。如果是HTML,那么浏览器将继续导航过程并为渲染过程做准备。默认情况下,浏览器会为每个页面分配一个渲染进程。如果从一个站点打开另一个站点,新页面和当前页面属于同一个站点(根域名加协议,包括该域名下的所有子域名和不同端口),那么新页面会重用渲染父页面的进程。提交文档浏览器进程将网络进程接收到的HTML数据交给渲染进程:首先,浏览器进程从网络进程接收到响应头数据,然后向渲染进程发送“提交文档”消息。渲染进程收到“提交文档”“确认文档”消息后,会与网络进程建立数据传输的“通道”,文档数据传输完成后,渲染进程返回“确认文档”消息给浏览器进程,浏览器进程收到“确认文档”消息后,会更新浏览器界面的状态,包括安全状态、地址栏的URL、前进后退的历史状态,更新网页页面渲染阶段,一旦提交了文档,渲染过程就会开始页面解析和子资源加载。。将HTML转换为浏览器可以理解的结构---DOM树2.DOM是存储在内存中的树结构样式计算1.将css文本转换成浏览器可以理解的结构---styleSheets2.转换样式表3.计算DOM树中每个节点的具体样式CSS继承:eachDOM节点包含父节点的样式样式级联(核心):定义了如何组合来自多个来源的属性值的算法。布局阶段——计算可见元素在DOM树中的几何位置1.创建包含可见元素的布局树2.布局计算3.分层渲染引擎为特殊节点生成专用层并合成对应的层树并不是每个节点都包含一个层。如果一个节点没有对应的层,那么这个节点从属于父节点的层。具有stackingcontext属性的元素会被提升到一个单独的层,需要被裁剪(clip)的地方也会被创建为一个层。图层绘制渲染引擎会将一个图层绘制拆分成许多小的绘制指令,然后生成这些指令,以组成一个待绘制的列表。光栅化(raster)操作合成线程会优先根据视口附近的tile生成位图,实际生成位图的操作由光栅化完成。所谓光栅化,就是将瓦片转换成位图。光栅化过程会使用GPU来加速生成。使用GPU生成位图的过程称为快速光栅化或GPU光栅化,生成为位图并保存在GPU中。合成和呈现一旦所有的图块都被栅格化,合成线程就会生成一个绘制图块命令——“DrawQuad”,然后将其提交给浏览器进程。在浏览器进程中有一个组件叫做viz,用于接收合成线程发送的“DrawQuad”命令,然后根据DrawQuad命令将页面内容绘制到内存中,然后将内存显示在屏幕上.重新排列更新元素的几何位置。重排需要更新完整的渲染管线。内存消耗最大。重绘更新元素的绘图属性。省略了布局和分层阶段,执行效率高于重排。Composite直接合成阶段相对于重绘和重排,合成可以大大提高绘图效率
