我意识到有许多教程和网站以及所有回答的问题＆＃34;哪个更适合游戏应用程序？＆＃34;他们都说SVG不适合游戏应用，画布就是。但这让我很困惑。
所以，让我们说我制作平台游戏。我希望主角走过舞台，背景画得很漂亮。在Canvas中，我要么必须重新创建她的整个hitbox（重新绘制每个移动实体的位置），要么创建一个单独的canvas元素并使用ctxChar, ctxBG, ctxItems等等。另一方面，对于SVG，它是内置。我甚至可以在<animate>标记内放置一个<use>标记来更改她的x位置（或通过js手动更改它），另一个<animate>标记可以更改她的精灵。然后永远不必触及背景。
至于同时制作一堆元素的动画，我不知道在Canvas中的速度比在SVG中更快。将svg元素放入组中有什么问题？它可以比重绘hitbox的背景并重新绘制所有实体的实体本身更慢吗？
编辑：我认为我的真正问题不在于SVG是否有效，而是为什么人们认为它无法实现。
答案 0 :(得分：19)
SVG V Canvas
作为专业游戏创建者，如果您希望创建基于浏览器的游戏，我的建议是远离SVG。主要原因是它太慢了。第二个原因是它会使你作为程序员的工作变得更加困难，因为找到SVG缺乏性能的解决方案很难。第三个原因，因为它非常慢，游戏都是关于性能的。
此页面将介绍SVG游戏设计An Original Approach to Web Game Development Using SVG，但在您深入阅读并阅读所有内容之前，请先查看游戏原型Runes and Relics Prototype。我的书里有点哼哼。
我确信在我的搜索中首次出现了其他尝试。但我从来没有玩过一个好的SVG游戏。
那么SVG有什么用呢？图形资源。 SVG是为您的游戏打包图像的好方法，一旦您在客户端上使用它们，您就可以将它们渲染到位图，然后使用它们来渲染您的游戏。美观是你获得了 S VG的分辨率独立可扩展性和小图像尺寸。但是通过在加载时将它们渲染到位图，您可以充分利用GPU来移动像素。 SVG在游戏中使用太慢了。
为什么要使用Canvas？我想说因为它速度很快，但是当你将它与原生C ++应用程序进行比较时，它不会比同等的Javascript / canvas游戏快10倍。快十倍是非常重要的，但是你没有得到你用Javascript获得的跨平台优势。
目前，canvas是真正的跨平台游戏应用程序的最佳选择。使用2D或3D webGL，您可以构建全屏全帧速率游戏。 HTML5有一套适合所有游戏需求的API，并且易于学习。
我不是游戏引擎的粉丝，它们是一个覆盖所有解决方案，你和已经很好设计的API之间的中间人强迫你做他们（不那么好）的方式。但是他们会很好地概述可能的内容。
Phaser是一个javascript画布游戏引擎，拥有大量资源和示例。这是一个开始，看看可以做些什么的好地方。不要被游戏引擎这样推销自己所吸引。 HTML5＆amp; JavasScript开箱即用，是城里最好的游戏引擎，运行本机代码，拥有庞大的用户和支持基础。花在学习如何使用游戏引擎API上的时间不会花时间学习如何使用HTML5 API（坦率地说，HTML5 API是完美的，是20年浏览器大战的结果） ）这实际上比游戏引擎更容易使用和学习。