元素变化时是否也需要应用 will-change CSS 属性？答案

【问题标题】：Does will-change CSS property need to be applied also while the element is changing?元素变化时是否也需要应用 will-change CSS 属性？
【发布时间】：2016-12-06 12:03:51
【问题描述】：

我正在尝试使用 CSS will-change property 而不是 translateZ(0) hack。

我了解需要在元素更改之前应用该属性。但我怀疑它是否需要在变化时也应用。

我很想知道是否需要在元素转换之前和期间应用该属性，还是只在之前。

【问题讨论】：

哪个是您的事件处理程序on 或one？
我想我会删除这个例子。我只是想知道该属性是否需要在同时元素发生变化时应用，或者是否可以仅在之前应用它。

标签： html css performance css-transitions will-change

【解决方案1】：

当相应的 CSS 属性正在更改（或更改）时，您不需要应用 will-change。

will-change 的主要目标是帮助浏览器“提前”应用一些对渲染器来说代价高昂的更改（例如，为将更改其 opacity 的元素创建新的堆叠上下文，而不是动态创建它在不透明度开始改变的那一刻）。如果更改已经发生，则无需再进行此类预优化。

【讨论】：

所以在它开始改变的那一刻就可以删除它对吧？
应该没问题。这里有一个很好的解释这个属性：dev.opera.com/articles/css-will-change-property

【解决方案2】：

will-change 属性的真正目的是警告浏览器所选元素将在未来的进程中发生变化，以便浏览器可以提前设置适当的优化。

某些属性在 will-change 中指定时将不起作用，因为浏览器不会对大多数属性的更改执行任何特殊优化。不过，指定它们仍然是安全的；它根本没有效果。在这种情况下 (translate) will-change 会产生影响。

在更改发生之前和之后使用脚本代码打开和关闭 will-change 是一个很好的做法，这是您问题的答案。

参考：https://kolosek.com/css-will-change/

【讨论】：