浏览器渲染原理DOM解析DOM树构建流程：1.根据HTML文档的内容，根据label对词进行分词2.根据token3产生对应的节点Node3。根据嵌套关系将节点组合成一个对象节点树DOM浏览器增量解析DocumentObjectModelDOM，无需等待整个HTML文档加载完成即可开始解析DOMC。CSSOM解析会阻塞HTMLParser；JavaScript脚本文件执行会阻塞HTML解析；CSS、JavaScript、Images和ForFont等静态资源的异步加载、页面渲染、CSS解析、JavaScript执行都会相互依赖。CSS解析CSSOM树构建CSSOM解析依赖于选择器，选择器的匹配是由内而外。所以选择器的嵌套层次越深，匹配的时间就越长。CSSOM只解析可见部分的body标签中的内容，并构建一个包含所有匹配元素的CSSOM树。从根节点向下，向下继承所有节点的属性。RenderTree树的构建使用DOM和CSSOM的结合来构建RenderTree。RecaculateStyleRenderTree对应的节点包含所有渲染网页必须的节点，不会被添加到RenderTree中，比如head和display:none;节点可见性：隐藏；节点会被添加到RenderTree中，浏览器通过GET请求获取网页，同时对HTML文档进行增量解析，生成DOM树。在解析DOM节点树时，所有需要加载的资源都会异步加载，但是CSS解析、JavaScript执行、字体文件下载会阻塞HTMLParser的本地DOM树和CSSOM树构建完成后，立即组装RenderTree渲染浏览器渲染页面。增量解析解析DOM树，完成相应的CSSOM解析后（RenderTree依赖DOM树，CSSOM树），直接开始渲染页面。4.2CSS加载会阻塞初始渲染。对于与首页无关的样式，您需要使用适当的方法来避免阻塞初始渲染：document.write()会阻塞页面的初始渲染。使用media=print媒体查询，虽然加载了样式表，但它只是在打印时才应用样式，并不会阻塞初始渲染。通过DOMAPI引入CSS，可以避免阻塞。
