关于will-change与transform是否强绑定

Question

如题，通过谷歌分析工具，在元素上使用transform避免重绘的同时，我没有写will-change，同样不会触发重绘。并且课程也有说道will-change不能大面积应用，所以什么情况下才需要使用will-change呢，还是我只要写了transform就要把对应的元素分到单独的图层

Answer 1

Mr_Max 2022-04-12 16:01:55

同学你好！

简单概括一下：
* transform可以借用GPU对动画进行处理，省去布局和重绘。

* 如果用translate3d, translateZ等3d相关变换，webkit浏览器中会触发GPU硬件加速，但是有额外资源开销。

* will-change是让浏览器有一个预判，可以提前准备建层优化。用太多肯定资源开销很大。还有就是时机，比如可以hover时再用，就不要在非hover时就加上will-change。

• 提问者 weixin_慕容4157932 #1

  非常感谢！

• ShaneQin 回复 提问者 weixin_慕容4157932 #2

  打错了

• ShaneQin #3

  那我是不是可以理解为GPU对动画进行处理和GPU硬件加速是两回事。transform只能借用GPU对动画进行处理，而translate3d, translateZ不仅能借用GPU对动画进行处理，还能触发GPU硬件加速

点开查看后面1条评论