canvas - 三个.js 渲染器

Question

有人可以解释一下three.js 渲染器之间的区别吗？哪个更快？哪一个更标准和跨浏览器？svg 渲染器和 dom 渲染器如何工作？当我在下面的代码中使用 webGl 而不是画布渲染器时，我得到了不同的结果，那为什么会发生呢？
cube = new THREE.Mesh( new THREE.CubeGeometry( 200, 200, 200, 1, 1, 1, materials ), new THREE.MeshFaceMaterial() );
canvas 和 webGL 有很大区别吗？我应该将哪一个用于高浏览量的网站？

Answer 1

如果您的目标是创建 3D 图形，您真的想创建仅支持 WebGL 的应用程序。其他 Three.JS 渲染器更像是 hack 和概念验证，而不是可以为您提供真实 3D 的东西。如果您的目标不是创建令人惊叹的图形，那么您可以简单地使用静态 PNG 图像、GIF 动画或 YouTube 剪辑，并具有更好的向后兼容性。<canvas>渲染后端仅对非常简单的图形有用（例如没有纹理的旋转立方体），并且<canvas>在许多情况下作为后备是行不通的。

• 在 WebGL 中创建您的独家内容

• 提供对旧版浏览器的回退

  • 使用 Google Chrome 框架http://www.chromium.org/developers/how-tos/chrome-frame-getting-started/chrome-frame-faq

  • 如果旧版浏览器用户不想在旧版浏览器中安装 Chrome Frame 插件，只需将他们重定向到静态图像和静态文本内容

例如，https ://tinkercad.com/home/ 是仅 WebGL 的 Web 应用程序。他们在 webshape.fi 会议上的估计是，大约 50% 的网站观众可以访问 WebGL 内容。这听起来可能很低，但仍然比在手机或桌面上安装应用程序的人高得多，因此使用 WebGL 部署 3D 的对话率高于通过其他部署机制。

另见http://webglstats.com/

WebGL 也是一种面向未来的技术——它不会消失。目前你主要针对桌面，但移动适应成为现实只是时间问题，2-3 年。

Answer 2

使用WebGLRenderer作为它的未来证明，而 imp 是大多数三种.js 方法都可以在其中工作。

例如 ParticleSystem 在 CanvasRenderer 中不起作用