浏览器渲染机制

DOM：Document Object Model，浏览器将HTML解析成树形的数据结构，简称DOM。CSSOM：CSS Object Model，浏览器将CSS解析成树形的数据结构，简称CSSOM。Render Tree: DOM和CSSOM合并后生成Render Tree，如下图：

image.png

Layout: 计算出Render Tree每个节点的具体位置。Painting：通过显卡，将Layout后的节点内容分别呈现到屏幕上。

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • 浏览器渲染机制基础
    浏览器指的是Chrome系浏览器【Firefox大同小异，IE未知】以下提到的“节点”、“标签”和“元素”不做区分...
    Yieiy阅读 4,125评论 4赞 26
  • 浏览器渲染机制
    大体分为以下步骤：1.解析HTML标签，构建DOM树。2.解析CSS标签，构建CSSOM树。3.把DOM和CSSO...
    饥人谷_张乐阅读 337评论 0赞 1
  • 浏览器渲染机制
    首先需要提到几个基本概念：DOM：Document Object Model，浏览器将HTML解析成树形的数据结构...
    clark124阅读 276评论 0赞 1
  • 浅谈浏览器渲染机制
    众所周知，浏览器是世界上用途最广泛的软件了，它们展现着网络资源，但达成这个目标的过程是复杂并且遵循着很多不同的标准...
    Ghj_小树阅读 776评论 0赞 0
  • 浏览器渲染机制
    参考链接：浏览器渲染的那些事(一)浏览器内部工作原理浏览器的渲染原理简介有关网页渲染，每个前端开发者都该知道的那点...
    恰皮阅读 512评论 3赞 1