浏览器回流认识

共计 455 个字符，预计需要花费 2 分钟才能阅读完成。

一、什么是回流？
回流是会导致页面重新渲染的一些元素，从而影响性能。
二、哪些因素会导致回流？
1、调整窗口的大小；
2、改变字体，如果用 rem 设置了根目录的字体大小，这样就减少了回流的次数；
3、增加或者移除样式表；
4、内容的变化，用户在 input 中输入了文字（这是不可避免的）；
5、激活 CSS 的伪类；
6、操作 class 属性；
7、基本操作 DOM(包括 js 中的 domcument 等)；
8、计算 offsetWidth 与 offsetHeight 属性，获取元素在窗口中的位置；
9、在 html 代码中直接设置 style 属性的值，这个降低了代码的利用率，还影响性能。
三、如何避免回流？
1、如果想设定元素的样式，直接改变 class 名，而不是改变 class 中的某个特定的属性，比如 height，weight;
2、避免设置多项内联样式，就是说少使用 style；
3、应用元素动画的时候，使用属性的 position 属性的 fixed 值或 absolute 值；
4、避免使用 table 布局；
5、尽量在 DOM 树的最末端改变 class, 改变子节点的样式。