CSS動畫業績比較基準

Question

我有一個web應用程序有以下─literally-噸的特殊效果，主要是CSS變換和不透明度的變化，看起來甜蜜和專業，但對於一些用戶有點問題，但。我收到的門票，在一些（主要是比較舊的）機器的動畫閃爍，而不是給順眼，他們是討厭。

我在這裏要求的測試用戶行爲最有效的方法，所以我將能夠在其上觸發body標籤，這將簡化一些，甚至關閉那些動畫老機器的一些類。

我現在的想法是使用一些開源JS基準（一些測試使用的畫布和時間不會超過200ms）和緩存結果的localStorage。問題是，當我在隱藏標籤中打開我的應用程序時，此基準測試顯示錯誤的結果。如何告訴用戶將有平穩的50-60fps的體驗，而不需要花費太多的時間來測試並獲得最可靠的結果？

謝謝

Answer 1

如何告訴用戶將擁有流暢的50-60fps經驗沒有考慮太多時間來檢驗，並有最可靠的結果？

我不認爲有一種方法可以做到這一點。潛在的，你可以訂購該服務（如CrossBrowserTesting或Leaptest）來獲取這些設備的錄像，看看自己。

從個人體驗 - 我們刪除Android平板電腦和iOS設備的所有花哨的CSS3動畫，因爲那些意外崩潰在我們的應用程序。

避免與不透明的動畫大層，像模態窗口背景等

一般 - 檢查repaint & reflow的videos和articles在瀏覽器和調試您的應用程序，看看什麼是或可能會導致問題的用戶。

希望有所幫助。