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

来源：3-5 避免重绘【必学，加速页面呈现】

weixin_慕容4157932

2022-04-11

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

写回答

1回答

Mr_Max

2022-04-12

已采纳

同学你好！

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

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

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

Mr_Max

ShaneQin

同学你好！不是哟，说的是一码事。另外在另外问题里也有提到过了，translate3d, translateZ都是transform变换。

2022-07-03

共4条回复

前端性能优化企业级解决方案 6大角度+大厂视野

只要项目还在线，性能优化永远是时刻要关注的问题

1109 学习 · 226 问题

相似问题

回答 1

回答 1

回答 1

回答 1

回答 1