What is advantage of using will-change property instead of translate3d for hardware acceleration?
<p>In the interesting article <a href="https://dev.opera.com/articles/css-will-change-property/" rel="nofollow">Everything You Need to Know About the CSS will-change Property</a> it says that using the <code>translate3d()</code> hack is the old way of doing things if you want hardware acceleration, and instead of that you should use <code>will-change</code>. Is there any benefit in performance when using <code>will-change</code>? I have found it is extremely difficult in some cases to add <code>will-change</code> via JavaScript just before element triggers animation. For example</p>

<ol>
<li>You can't just put <code>will-change</code> in CSS and expect it to work, because it will be worse if you had multiple elements.</li>
<li>You can't either put <code>will-change</code> in <code>:hover</code> pseudo selector because the browser needs some time to prepare.</li>
<li>You are left with animation on click event, when you can add <code>willChange</code> on hover via JavaScript leaving the browser enough time to prepare (200ms).</li>
</ol>

<p>Overall you must somehow predict users behavior and that is difficult. It is too complicated (you must, also, remove <code>will-change</code> after animation ends) over <code>translate3d()</code>. Why use it?</p>