是否可以在 CSS 宽度转换上强制硬件加速

Question

当我使用 CSS 转换更改元素的宽度或边距时，我注意到了不稳定的性能。

反正有没有强制硬件加速？有什么方法可以使用变换属性来实现非常相似的结果吗？

Answer 1

并不真地。硬件加速取决于很多因素，它们都不受 javascript 控制。

这给我们留下了如何提高 CSS 宽度/边距转换性能的问题，答案通常是“用缩放替换它”，因为它可以在 GPU 上便宜地完成，并且不会触发回流。

• http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/
• http://blogs.adobe.com/webplatform/2014/03/18/css-animations-and-transitions-performance/
• 提高 CSS3 过渡性能
• Chrome 中生涩的 CSS 转换过渡

众所周知，Chrome 在加速 CSS 转换方面不如 Firefox 和 IE。

• 为什么某些 CSS 属性的转换缓慢且不流畅
• Firefox 与 Chrome 和 IE 中的 CSS3 变换差异
• http://www.binarymoon.co.uk/2014/02/fixing-css-transitions-in-google-chrome/

事实上，考虑到谷歌以速度为由拒绝了Pointer Event ，而IE通过GPU加速解决了这个问题，可以说Chrome（以及一般的Webkit——Safari更慢）在这方面落后了，唯一的办法帮助是为 Chromium / Webkit贡献代码。

我宁愿切换到更快的过渡。