1、HTML的加载
HTML是一个网页的基础,下载完成后解析
2、其他静态资源加载
解析HTML时,发现其中有其他外部资源链接比如CSS、JS、图片等,会立即启用别的线程下载。
但当外部资源是JS时,HTML的解析会停下来,等JS下载完执行结束后才继续解析HTML,防止JS修改已经完成的解析结果
3、DOM树构建
在HTML解析的同时,解析器会把解析完成的结果转换成DOM对象,再进一步构建DOM树
4、CSSOM树构建
CSS下载完之后对CSS进行解析,解析成CSS对象,然后把CSS对象组装起来,构建CSSOM树
5、渲染树构建
当DOM树和CSSOM树都构建完之后,浏览器根据这两个树构建一棵渲染树
6、布局计算
渲染树构建完成以后,浏览器计算所有元素大小和绝对位置
7、渲染
布局计算完成后,浏览器在页面渲染元素。经过渲染引擎处理后,整个页面就显示出来