JavaScript遊戲開發中Canvas與DOM的優缺點有哪些？

Question

與使用畫布相比，在「純」DOM中創建遊戲的優點和缺點是什麼？

Answer 1

使用畫布，您可以執行諸如旋轉之類的操作，而無需使用某些「重量級」技巧即可使用純圓頂無法完成的操作。無論如何，DOM更快，你可以在每個瀏覽器中使用它，沒有任何問題。你必須考慮你將在遊戲中使用什麼，如果你只使用基本操作，使用dom，否則選擇畫布。

Answer 2

看這裏：Why Canvas is not an obvious choice for web games。

Answer 3

當您使用Canvas進行開發時，您將不得不使用GameLoop技術，這非常痛苦，因爲您必須始終重繪所有元素。

當您使用DOM進行開發時，您將只能重新繪製已修改的對象，並且會讓瀏覽器實現工作變得艱難。

如果你的遊戲每幀有幾個修改，那麼你可以使用DOM，否則請使用Canvas！它快得多！

Answer 4

畫布 優點：

1. 可以操縱像素並應用過濾器的效果，所以容易進行圖像處理;
2. 爲大小小，但數以百計的遊戲元素非常有效的
3. 遊戲許多圖書館可以用帆布，如box2dweb被發現，並且可以使真棒遊戲，如憤怒的小鳥

缺點：

1. 它是無狀態的，所以你必須記錄畫布中元素的狀態，並自己處理點擊測試。
2. 對於非常大的尺寸效率很低，但在遊戲中只有一個元素
3. 很強的能力，很大的責任感。畫的自由，帶來你必須負責所有的繪圖人員。幸運的是，那裏有許多庫，例如cocos2d-html5，IvanK。

DOM 優點：

1. 渲染由瀏覽器，所以不易出錯;

缺點：

1. 可以做簡單的動畫只用CSS，這使得遊戲不流暢;
2. 對操縱數百個DOM元素沒有好處;