在SVG或WebGL中使用Canvas进行3D应用

Question

我需要构建一个html5 / javascript 3d应用程序，每个场景我必须渲染很多对象（大约200-300个复杂对象或更多）而不会滞后，所以请告诉我应该选择哪种渲染技术，HTML5 Canvas，SVG或WebGL。

我听说使用Canvas combine with SVG可以提供更好的性能，但是将它转换为3d环境有多复杂，在SVG中有任何javascript引擎支持Canvas吗？或者我应该为Canvas和WebGL选择three.js.

Answer 1

HTML5 / Canvas / SVG适用于静态图像，但不适用于允许移动的3D应用程序。

HTML5和SVG没有实现3D机制，因此创建这样的场景可能会变得非常复杂。画布只是某种表面，需要进一步的逻辑或技术来绘制它。

另一个考虑因素是不同的浏览器可能具有非常不同的性能，例如（目前我写这个答案）比较Chromium和Firefox，一个更好地移动一个巨大的图像，而另一个更好地移动数千个小的。

WebGL是OpenGL for web的简化版，它使用图形卡渲染复杂的场景，比如游戏。这将允许真实的3D和逼真的渲染。价格是复杂的：需要一些时间来学习和正确应用。

对于简单的3D效果和样式，WebGL是一种矫枉过正，而SVG将是一种更简单的替代方案。对于真正的3D，WebGL提供了全部功能。