使用 will-change 属性提高动画性能

在创建动画和其他 GPU 重要动作时，了解 will-change 属性非常重要。

CSS 关键帧和 transition 属性都使用 GPU 加速。通过将计算卸载到设备的 GPU 来提高性能。这是通过创建卸载到 GPU 以进行计算的绘制图层（单独渲染的页面部分）来完成的。will-change 属性告诉浏览器什么是动画，允许浏览器创建更小的绘制区域，从而提高性能。

will-change 属性接受以逗号分隔的属性列表以进行动画处理。例如，如果你计划转换对象并更改其不透明度，则应指定：

.Example{
    ...
    will-change: transform, opacity;
}

注意： 谨慎使用 will-change。为页面上的每个元素设置 will-change 可能会导致性能问题，因为浏览器可能会尝试为每个元素创建绘制层，从而显着增加 GPU 完成的处理量。