浏览器渲染原理

浏览器从服务器那收到的HTML,CSS,JavaScript等相关资源,然后经过一系列处理后渲染出来的web页面的过程

过程

  1. 浏览器将获取的HTML文档解析成DOM树
  2. 处理CSS标记,构成层叠样式表模型CSSOM(CSS Object Model)
  3. 将DOM和CSSOM合并为渲染树(rendering tree)将会被创建,代表一系列将被渲染的对象
  4. 渲染树的每个元素包含的内容都是计算过的,它被称之为布局layout。浏览器使用一种流式处理的方法,只需要一次pass绘制操作就可以布局所有的元素
  5. 将渲染树的各个节点绘制到屏幕上,这一步被称为绘制painting
    浏览器渲染原理