任何硬件加速一切的回退？

是否有任何理由不硬件加速與任何硬件加速一切的回退？

transform: translate3d(0,0,0);

一切使用*作爲選擇？

什麼東西應該硬件加速，什麼東西不是？

來源

2013-04-05 IMUXIxD

@IMUXIxD你問一個非常好的問題，答案是否定的，你不應該硬件加速一切似乎可以解決的問題，但實際上可能會導致其他幾個問題。當您嘗試z-index項目時，它也會導致奇怪的顯示問題，因爲硬件加速對象在動畫時傾向於將它們從DOM中移除。

我寫了一篇關於我對硬件加速理解和測試的廣泛文章http://blog.zindustriesonline.com/gpu-accelerated-animations-and-composite-layering/ 它還有一個關於Netflix工程師Matt Seeley的工作非常好的視頻。

我希望這可以幫助您更好地理解使用硬件加速的優點和缺點，以及最佳用例場景。

來源

2013-04-05 06:35:40 Zanderi

所以只能使用'transform：translate3d（0，0，0）;'元素我會動畫？我只是在褪色或滑動的元素呢？ – IMUXIxD 2013-04-05 08:00:20

褪色不應該需要任何3D加速，只要滑動，你將不得不玩弄哪些屬性最適合你。一旦你指定了translate3d，引擎就會假設你確切地知道你想如何處理它並將它拋到你的腿上，如果你只是使用translateX或translateY，瀏覽器就足夠聰明，它仍然可以管理很多動畫和重繪。 – Zanderi 2013-04-05 16:04:47

問題出現在複合層次中，越是強制瀏覽器重新繪製性能變得越糟糕。理想情況下，您希望最少量的重繪，這就是我的博客上所有這些數字的重點。爲了做到這一點，您可能需要使用不同的屬性I.E.你可能想要動畫保證金而不是translateX。當您開始使用這些屬性時，您會注意到移動設備和平板電腦設備上發生的最大變化。有時你必須忽略這些規則才能在webkit瀏覽器中創建動畫功能;最值得注意的是android瀏覽器不是chrome/safar – Zanderi 2013-04-05 16:12:40

任何硬件加速一切的回退？

回答

相關問題