js底层原理

1.操作DOM是昂贵的（操作DOM会导致重排和重绘）
2.js和DOM是两种东西，每次连接都需要消耗性能。
【js和DOM存在不同的文件中，例如chorme，使用webCore库来渲染页面，单js引擎是V8】

---

浏览器渲染过程：
1.解析HTML，构建DOM树
2.解析CSS，生产css规则树
3.合并DOM树和CSS规则树，生成render树
4.布局render树，负责各元素尺寸、位置的计算
5.绘制render树，绘制页面像素信息
6.浏览器会将各层的信息发送给GUP，GUP将各层合成

（不可见节点：meta、link标签，display:none属性标签）
造成重排的操作：添加或删除可见的dom元素、元素位置改变、尺寸改变、内容改变、页面渲染器初始化、浏览器窗口尺寸改变
触发重排的属性：offsetTop offsetLeft offsetWidth offsetHeight scrollTop scrollLeft scrollWidth scrollHeight clientTop clientLeft clientWidth clientHeight getComputedStyle()
【触发重排一定会触发重绘】
造成重绘的操作：改变颜色等

---