从浏览器输入域名到加载完页面的流程

过程大致分为2个过程：获取资源和解析渲染资源

从URL输入到浏览器地址栏回车之后，首先直行当前页面的beforeunload事件中的函数，然后跳转页面（假设已经允许跳转页面）

 

 

 

 然后判断是否有缓存资源，若缓存列表中有资源则去缓存列表中加载，若没有则进行下面操作。

首先进行DNS解析，把域名解析为对应服务器的ip。若是https协议的链接，进行tls的连接。

然后建立tcp连接

连接建立之后浏览器携带请求头，请求行，以及cookie的等信息一块放入请求头中发送到服务器

然后经过负载均衡的服务器（将请求发送到多个服务器上）

服务器响应浏览器的请求，并返回内容给浏览器

然后浏览器根据状态码进行判断，若是400，500则报错，300则重定向（次数有限制，超出则报错），200则下载资源

然后解析文件

如果是gzip格式，则先解压，然后解码

然后准备渲染

若是HTML则渲染DOM树

若是CSS则渲染CSSOM树

若是script,

　　有async 则并行下载并执行js文件

　　有defer 则先下载js文件，等待HTML解析完成后再执行js

　　都没有，则会阻塞渲染，要js下载完成并且执行完成后再加载HTML,因此一般都放在最后

然后CSSDOM树和DOM树构建之后生成render树，进行页面布局，样式调整

生成render树过程中，浏览器开始调用GPU绘制，合成图层，展示在页面上。

流程图如下：