构建请求行
GET / HTTP/1.1
方法 请求路径 请求的协议/版本
复制代码查找强缓存
检查资源是否存在强缓存,存在的话直接进行资源解析
读取DNS缓存
浏览器先检查自身缓存中有没有被解析过的这个域名对应的ip地址，如果有，解析结束
检查操作系统缓存中有没有对应的已解析过的结果(win中的hosts文件)
都没有则进行下一步
DNS解析
请求本地域名服务器（LDNS）来解析这个域名,没有则进行下一步
DNS 根服务器查询
建立TCP连接
可以在此简述建立TCP链接的3次握手的过程
客户端向服务端发送请求报文
服务端收到请求报文,同意连接则向客户端发送一个应答
客户端收到服务端的应答,并告知服务端我准备好了
TCP 的一些特性
建立连接需要进行三次握手
断开连接都需要四次握手
在传输数据的过程中，通过各种算法保证数据的可靠性
相比 UDP 来说不那么的高效。
判断是否是Https请求
是:进行TLS握手
基本过程
客户端向服务器端索要并验证公钥
双方协商生成”对话密钥”
双方采用”对话密钥”进行加密通信
在 TLS 握手阶段，两端使用非对称加密的方式来通信，但是因为非对称加密损耗的性能比对称加密大，所以在正式传输数据时，两端使用对称加密的方式通信
否:发起Http请求
发送HTTP请求
向服务端正式发送http请求
返回HTTP报文
服务器处理请求响应结果,并返回Http报文
判断状态码是什么?
200:继续解析，如果 4xx 或 5xx 的话就会报错，如果 3xx 进行重定向
如果是gzip格式的话会先解压一下，然后通过文件的编码格式去解码文件
浏览器解析渲染页面
针对下载完成后的HTML文件
词法分析:标记化
语法分析:构建DOM树
解析HTML(超文本标记语言)-->DOM(文档对象模型)树
遇到 script 标签的话，会判断是否存在 async 或者 defer属性
async:并行进行下载,下载完成后并执行js
defer:先并行下载文件，然后等待 HTML 解析完成后顺序执行。
如果都没有:就会阻塞住渲染流程直到 JS 下载并执行完毕
遇到link下载并解析CSS(层叠样式表)-->CSSOM(CSS对象模型)树
link标签引用
style标签中的样式
元素的内嵌style属性
DOM树 + CSSOM树 --> Render Tree(渲染树):CSSOM 树和 DOM 树构建完成后开始生成渲染树
回流(Layout):根据生成的渲染树,回流得到节点的几何信息(位置,尺寸)
计算可见的Dom节点在设备视口的位置和尺寸,这个计算阶段就是回流
为了知道每个可见节点在视口的确切大小和位置,浏览器从渲染树的根节点进行遍历
重绘(Painting):根据渲染树与回流得到的节点几何信息,得到节点的绝对像素
经过生成的渲染树和回流阶段,得到了所有可见节点具体的几何信息与样式,然后将渲染树的每个节点转换成屏幕上的实际像素,这个阶段就叫重绘节点
将像素发送给GPU绘制,合成图层,然后展示在页面上
断开TCP连接
简述断开进行4次数握手过程
客户端对服务端发送释放连接的请求
服务端收到客户端的请求后,告知应用层释放连接
服务端将数据发送完毕后,再向客户端发送释放连接请求
客户端收到释放请求后,并向服务端发送确认释放的应答,同意释放
网友评论