在所有動畫製作方法之間進行選擇

Question

這些天有各種各樣的動畫元素製作方法。 HTML5 canvas動畫，CSS3動畫和轉換，常規CSS動畫，甚至創建新的HTML對象（http://uperduper.com/tronGame/index.html）。你如何選擇所有這些？有沒有更快的速度？

Answer 1

我敢肯定，毫不奇怪，簡單的答案是「這取決於」。有幾個因素可以影響動畫技術的選擇：

1. 如您所說，性能絕對是一個因素。現代瀏覽器，特別是在移動設備上，可以依靠基於硬件的圖形加速來獲得最佳性能。強制使用硬件加速的最可靠方法是小心使用CSS轉換。如果你的目標是最高性能，那麼CSS3可能是最好的方法。

2. 但並非所有的瀏覽器都支持CSS3。例如，如果您的用戶使用Internet Explorer 8訪問您的網站，那麼CSS3轉換和轉換將不適用。您可以選擇（a）放棄這些用戶的動畫（如果動畫對您的網站不是必需的），或者（b）使用更普遍支持的不同技術。對於後者，基於JavaScript的動畫（特別是jQuery中的動畫）可能是最好的方法。

3. 當然，這些答案假設您的目標可以通過JavaScript訪問CSS3轉換和/或CSS（及相關）屬性。如果你有一個複雜的動畫，這可能不是真的。 （嗯，可以在CSS和/或JavaScript中重現任何動畫，但複雜性可能令人難以置信）。對於更復雜的動畫，您可能需要查看畫布動畫（尤其是如果您的源藝術品是基於柵格的）甚至是SVG動畫（如果你的源是基於矢量的）。

而且這些選項沒有考慮到源或受衆以外的因素。其他要問的問題包括開發者的技能和經驗。對JavaScript開發非常熟悉的人在使用JavaScript/jQuery方法時可能會更加成功，而更傳統的（例如Flash）設計人員可能更適合使用canvas或SVG。