GPU如何加速CSS转换? [英] How to GPU accelerate CSS transform?

问题描述

我知道有时浏览器会GPU加速CSS转换.但是什么时候发生，有没有办法强制GPU加速以获得平滑的动画?

本文

解决方案

大多数现代浏览器都支持GPU加速，但是只有当他们认为DOM元素会从中受益时才使用它.最有力的迹象是正在应用3D转换.因此，请使用3D等效转换.例如，使用transform: translate3d(50px, 0, 0)代替transform: translateX(50px).有关更多信息，请参见本文. >

I know that sometimes browsers will GPU accelerate a CSS transform. But when does that happen, and is there a way to force GPU acceleration for a smooth animation?

this article

解决方案

Most modern browsers support GPU acceleration, but they only use it when they think a DOM element will benefit from it. The strongest indication is that a 3D transformation is being applied. So use the 3D-equivalent transform. For example, instead of transform: translateX(50px), use transform: translate3d(50px, 0, 0). See this article for more information.

这篇关于GPU如何加速CSS转换?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！