前端了解网页解析的全过程

网页解析的全过程
1、用户输入网址，浏览器发起DNS查询请求
2、建立TCP连接
3、浏览器向web服务器发送一个http请求
4、发送响应数据给客户端
5、浏览器解析http response

（1）html文档解析（DOM Tree）

在浏览器没有完整的接收全部HTML文档时，它就已经开始显示这个页面了。生成解析树解析即dom树，是由dom元素及属性节点组成，树的根是docunment对象。

（2）浏览器发送获取嵌入在html中的对象

加载过程中遇到外部css文件，浏览器另外发出一个请求，来获取css文件。遇到图片资源，浏览器也会另发出一个请求，来获取图片资源。这是异步请求，并不会影响html文档进行加载。但是当文档加载过程中遇到js文件，html文档会挂起渲染的线程，不仅要等待文档中的js文件加载完毕，还要等待解析执行完毕，才能恢复html文档的渲染线程。

（3）css解析

浏览器下载css文件，将css文件解析为样式表对象，并来用渲染dom tree。该对象包含css规则，该规则包含选择器和声明对象。

css元素遍历的顺序，是从树的低端向上遍历。

（4）js解析

浏览器UI线程：单线程，大多数浏览器让一个单线程共用于执行JavaScript和更新用户界面

js阻塞页面：浏览器里的http请求被阻塞一般都是由js所引起，具体原因是js文件在下载完毕之后会立即执行，而js执行时候会阻塞浏览器的其他行为，有一段时间是没好网络请求被处理的，这段空闲时间就是所谓的http请求被阻塞。

js被阻塞的原因：之所以会阻塞U线程的执行，是因为js能控制UI的展示，而页面加载的规则是要顺序执行，所以在碰到js代码时候UI线程会首先执行他。

标签：线程,浏览器,js,文档,全过程,网页,解析,css
来源： https://www.cnblogs.com/k1990603/p/16294777.html