在没有关闭H/W加速的情况下优化CSS3动画会让它在GPU上运行得更快吗

Would optimizing a CSS3 animation without H/W acceleration off make it run faster on GPU afterwards?

本文关键字:GPU 运行 动画 优化 情况下 加速 CSS3      更新时间:2024-03-13

这个问题一开始听起来很奇怪,但请耐心等待。

我写了一个基于setTimeout的基准测试(类似于stats.js),目的是比较动画在不同条件下的表现(比如添加不同的CSS3属性)。对于(简单的)例子,我会用旋转和长方体阴影设置动画,然后在第二次运行中删除旋转,在第三次运行中移除长方体阴影。之后,我会有3个基准数字来比较每个动画的表现。

只要动画不是GPU加速的(由于明显的原因,即H/W加速将动画从页面的单进程结构中删除),这就可以很好地工作。

但这也让我想到了一个价值百万美元的问题——如果我在没有GPU加速的情况下优化一些东西以更好地运行,这是否意味着在GPU加速打开的情况下,同样优化的动画会更好地运行(更快或使用更少的内存)?还是适用不同的规则?

让我给你举一个简单的例子。CSS3盒子阴影几乎在任何动画中都会扼杀性能。在更简单的情况下,您可以通过将CSS3长方体阴影替换为类似阴影的光栅化(PNG?)图像来提高性能。然而,在GPU打开的情况下,其好处并不是肉眼可见的,因为这两个动画看起来运行速度几乎相同(因为我无法跟踪GPU打开时的性能变化)。那么,同样的规则适用于GPU的打开和关闭吗?

我最初的冲动是——一旦某个东西被优化了——无论GPU打开还是关闭,它都能运行得更好。但正如我在下面的评论中提到的(如果我理解错误,请纠正我),但硬件加速元素在GPU上缓存为预渲染光栅纹理。如果这是真的——如果我的阴影是CSS3框阴影或基于图像的PNG阴影,为什么会有什么不同?我的意思是,在GPU打开的情况下,这两个元素都会变成光栅化的纹理,对吧?所以我的优化在GPU打开的情况下没有任何意义?(除非内存使用率再次出现差异…)

当然。看看这里,了解一下GPU加速的作用和不作用。但总的来说,是的,它将保留您的大部分优化。现在,在相对意义上,给定的优化将在GPU卸载后对性能产生多大影响。。这是一个很难回答的问题。