1.什么是回流和重绘要解释回流和重绘,首先要了解排列和绘制,浏览器渲染页面,获取html和css资源后,如下步骤将大致完成。(1)html生成html树(2)css表格css规则(3)两者形成渲染树(4)去文档中找到各自的布局位置-----排列(5)填写内容document------绘图【排列】是计算位置和调整布局的过程,【绘图】是绘制它的过程。【重排】是除了初始布局之外,经过一些操作,重新找到dom元素位置的过程。【重绘】是重绘内容的过程。二、什么情况下会引起重排和重绘1、先说重排。重新排列与位置和移动布局的变化有关。主要有以下几种情况会引起重排(1)浏览器窗口发生变化,每次浏览器窗口放大或缩小,页面的所有元素都要重新排列重绘(2)添加、删除、移动dom元素,更改dom元素的宽高、内外边距、内容,修改dom元素的样式(3)查询dom元素的宽高,因为每次查询,浏览器都会重新计算所有元素,确保计算出的值是正确的。2.再来说说重绘,主要是元素外观发生变化,布局不会重绘。以下几种情况会导致重绘元素的背景(background)、文字颜色(color)、边框样式(outline)发生变化。3.重排和重绘的关系不一定需要重绘Arrangement,因为可能只是修改文字颜色的元素,不需要重新布局,重排大多数情况下需要重绘,因为重排元素后,它需要被绘制到屏幕上。下面展示重排和重绘的耗时。两秒后方块向右移动100px。3、为什么要优化,因为重排和重绘不仅仅是对单个dom元素进行操作,而是对整个[layer]进行操作,需要时间,而且频率高的话,会极大地影响性能。那么什么是图层呢?如下图所示,因为每次重排和重绘都是对整个图层进行操作,那么我们可以为需要频繁操作的dom元素再创建一个图层,尽可能少的触发重排和重绘。那么什么情况下可以开启图层呢?对于频繁操作,chrome浏览器自动打开图层,主要有以下几种情况:1.CSS3D变化图形----transform:translateX(0)2.html5中的
