前端web页面的渲染流程
image.png
1、构建DOM与 CSSOM
浏览器通过http请求，获得静态资源后，进行页面渲染时，构建dom与cssom是同时进行的。
html 构建dom
构建dom时，按照html页面中标签的顺序，由上向下渲染。
css 构建cssom
html构建cssom的同时，将css样式构建为cssom
2、渲染树 Render Tree
该过程中DOM与CSSOM合并，生成渲染树，树中包含了渲染页面所需要的节点。
3、布局Layout
计算出每个节点对象的精确位置和大小
4、绘制Paint
使用上面准备好的节点信息，绘制出页面
javascript
我们看到，在构建DOM和CSSOM阶段，会有javascript进入
1、当浏览器遇到一个 script 标记时，DOM 构建将暂停，直至脚本完成执行。
2、JavaScript 可以查询和修改 DOM 与 CSSOM。
3、JavaScript 执行将暂停，直至 CSSOM 就绪。
————————————————
原文链接：https://blog.csdn.net/baidu_30891377/article/details/106313534
网友评论