是否可以在 CSS 宽度转换上强制硬件加速
Is it possible to force hardware acceleration on a CSS width transition
当我使用 CSS 转换更改元素宽度或边距时,我注意到性能不稳定。
有没有强制硬件加速?有什么方法可以使用转换属性来实现无缝相似的结果吗?
不是真的。硬件加速取决于很多因素,none 其中 javascript 受控。
这给我们留下了如何提高 CSS width/margin 过渡性能的问题,答案通常是 "replace it with scale",因为它可以在 GPU 上以低廉的成本完成,而且它不't 触发回流。
- http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/
- http://blogs.adobe.com/webplatform/2014/03/18/css-animations-and-transitions-performance/
- Improving CSS3 transition performance
- Jerky CSS transform transition in Chrome
众所周知,Chrome 在加速 CSS 转换方面不如 Firefox 和 IE。
- Why transitions for some CSS properties are slow and none fluent
- CSS3 transform difference in Firefox and Chrome and IE
- http://www.binarymoon.co.uk/2014/02/fixing-css-transitions-in-google-chrome/
事实上,假设 Google 拒绝了指针事件 on the ground of speed, which IE solved by GPU acceleration, it can be said that Chrome (and Webkit in general - Safari is even slower) is lagging behind on this front, and the only way to help is contributing code to Chromium / Webkit。
我宁愿切换到更快的过渡。
当我使用 CSS 转换更改元素宽度或边距时,我注意到性能不稳定。
有没有强制硬件加速?有什么方法可以使用转换属性来实现无缝相似的结果吗?
不是真的。硬件加速取决于很多因素,none 其中 javascript 受控。
这给我们留下了如何提高 CSS width/margin 过渡性能的问题,答案通常是 "replace it with scale",因为它可以在 GPU 上以低廉的成本完成,而且它不't 触发回流。
- http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/
- http://blogs.adobe.com/webplatform/2014/03/18/css-animations-and-transitions-performance/
- Improving CSS3 transition performance
- Jerky CSS transform transition in Chrome
众所周知,Chrome 在加速 CSS 转换方面不如 Firefox 和 IE。
- Why transitions for some CSS properties are slow and none fluent
- CSS3 transform difference in Firefox and Chrome and IE
- http://www.binarymoon.co.uk/2014/02/fixing-css-transitions-in-google-chrome/
事实上,假设 Google 拒绝了指针事件 on the ground of speed, which IE solved by GPU acceleration, it can be said that Chrome (and Webkit in general - Safari is even slower) is lagging behind on this front, and the only way to help is contributing code to Chromium / Webkit。
我宁愿切换到更快的过渡。