这个转换为什么不利用GPU（或者它）？

我正在调查Will Boyd和他在css conf上柔滑流畅的动画演讲。这个转换为什么不利用GPU（或者它）？

现在试图复制，没有任何成功（或至少我认为）。当使用transform它假定利用gpu的优势，所以在devtools中，当采用“渲染/着色闪烁”选项时，它不会显示为渲染，但它确实如此。有任何想法吗？

我的例子
CSS的区别是，full code and demo on codepen

@keyframes bad-gpu { 
    0%, 100% { left: 0px; } 
    50% { left: 400px; } 
} 

@keyframes good-gpu { 
    0%, 100% { transform: translateX(0px); } 
    50% { transform: translateX(400px); } 
}

来源

2016-10-07 Dejan.S

您的浏览器是否可以在您的GPU上使用硬件加速功能？ – Oriol

是的，使用Chrome的MacBook Pro“晚13”，也将威尔的例子工作得很好，不会显示油漆闪烁。 –

转到'chrome：// gpu'并检查硬件加速 – Oriol

-2

CSS动画是不会自动GPU加速。它们正在被浏览器的渲染引擎执行。但是，如果我们使用transform或translate3d指定动画，那么浏览器使用GPU来渲染更具执行性的图形。

来源

2016-10-07 16:03:34

您是否阅读过该问题或查看示例？我清楚地说明了有和没有'transform'即GPU的例子。 –

这个转换为什么不利用GPU（或者它）？

回答

相关问题