THREE.js渲染器

Question

有人可以解释three.js渲染器之间有什么区别吗？哪一个更快？哪一个更标准,跨浏览器？svg渲染器和dom渲染器如何工作？当我使用webGl而不是canvas渲染器来获取下面的代码时,我有不同的结果,为什么会发生？
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渲染器更像是黑客和概念验证,而不是可以为您提供真正3D的东西.如果您的目标不是创建令人惊叹的图形,那么您可以简单地使用静态PNG图像,GIF动画或YouTube剪辑,并具有更好的向后兼容性.<canvas>渲染后端仅对非常非常简单的图形非常有用(比如没有纹理的旋转立方体),并且<canvas>在许多情况下回退不起作用.

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

• 提供旧版浏览器的回退

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

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

例如,https://tinkercad.com/home/是仅限WebGL的Web应用程序.他们在webshaped.fi会议上的估计是,大约50%的网站受众可以访问WebGL内容.这可能听起来很低,但它仍然远高于在移动设备或桌面上安装应用程序的人,因此使用WebGL部署3D的会话速率高于其他部署机制.

另见http://webglstats.com/

WebGL也是一种面向未来的技术 - 它不会消失.目前,您主要以桌面为目标,但在移动适应成为现实之前,只需要2到3年的时间.