关于html这个文件到显示到页面的这个过程

169 阅读1分钟

看了一些网上的帖子,首先自己对于这个过程的理解是,首先浏览器会先去解析html然后构建dom树,并且在这个过程中并行的去请求css/image/js,css的文件下载完成之后开始构建cssom,于是将dom树和cssom结合起来形成渲染树进行布局和显示,布局就是计算节点在屏幕的位置,显示就是把这些页面画在屏幕上。
大体的过程是如上所述的,那么接下来会涉及到两个词,一个是重绘,一个是回流(重排),所谓的重绘就是页面中的盒子比如颜色变了、不影响布局的时候进行重绘,如果是定位、尺寸大小等变了就会进行回流。
综上就是,重绘不会触发回流,但是回流肯定会触发重绘。

补充:DOM 树 和 渲染树 的区别:

  • DOM 树与 HTML 标签一一对应,包括 head 和隐藏元素
  • 渲染树不包括 head 和隐藏元素,大段文本的每一个行都是独立节点,每一个节点都有对应的 css 属性