页面的重绘和重排会产生计算消耗，为了提升性能，我们应该尽可能的降低页面的重绘和重排。
用展开/折叠的方式来显示和隐藏部分页面是一种常见的交互模式。它通常包括展开区域的几何动画，并将页面其他部分推向下方。
一般来说，重排只影响渲染树中的一小部分，但也可能影响很大的部分，甚至整个渲染树。浏览器所需重排的次数越少，应用程序的响应速度就越快。因此当页面顶部的一个动画推移页面整个月下的部分时，会导致一次代价昂贵的大规模重排。渲染树中需要重新计算的节点越多，情况就会越糟糕。
使用以下步骤可以避免页面中的大部分重排：
1、使用绝对位置定位页面上的动画元素，将其脱离文档流。
2、让元素动起来。当它扩大时，会临时覆盖部分页面。但这只是页面一个小区域的重绘过程，不会产生重排并重绘页面的大部分内容。
3、当动画结束时恢复定位，从而只会下移一次文档的其他元素。
142
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
