HTML5 动画 - 画布还是 DOM？ [关闭]

Question

我想知道在固定背景上移动精灵（图像）的最有效解决方案是什么：使用具有绝对定位的 DOM 元素或在画布上为它们设置动画（使用 drawImage 和 clearRect）？

我在第一个选项中看到的优势是我不必担心在绘制新位置之前擦除旧位置。有意义吗？

您还有其他好的选择吗？

谢谢

编辑：我想专注于移动设备。它在 HTML5 支持方面有很大的不同吗？

Answer 1

HTML5 Canvas 相对较新，如果 sprite 很少，你应该使用 DOM 元素，它适用于大多数浏览器。别忘了，一些旧的 MSIE 不能显示透明的 PNG，只能显示 GIF（我不记得版本），还有很多人使用过时的浏览器。

另外一个不错的选择是不做，也不要在您的网站上使用 animgif；小心飞来飞去的东西，少即是多。

Answer 2

这里有一些“专业”的画布参数：

• 画布的优点是可以进行 2D 加速，并且可以获得高 fps。
• DOM 的问题还在于您只能使用矩形。
• 所有现代浏览器都支持不错的画布，因此如果您不受旧系统的限制，使用画布更有意义

Answer 3

如果您的要求不要求您使用 Canvas，请使用 DOM 元素和绝对定位，因为它适用于旧版浏览器。