浏览器的渲染机制

107 阅读1分钟

浏览器渲染的过程主要包括以下五步

  1. 构建DOM树,浏览器将获取的HTML文档解析成DOM树。

  2. 构建CSSOM树,处理CSS标记,构成层叠样式表模型CSSOM(CSS Object Model)。

  3. 样式,将DOM和CSSOM生成一颗渲染树(REndering tree)

  4. 布局,在渲染树上运行布局layout计算每个节点的几何体和每个元素包含的内容。浏览器使用一种流式处理的方法,只需要一次绘制操作就可以布局所有的元素。第一次确定节点的大小和位置称为布局。随后对节点大小和位置的重新计算称为回流。

  5. 绘制,将渲染树的各个节点绘制到屏幕上,称为绘制painting

预加载分析器

参考文章:developer.mozilla.org/zh-CN/docs/…