CODEWITHSUNDEEP
canvassvgwebwebglthree.js
Erfan
Erfan

Reputation: 1192

THREE.js renderers

Can someone explain what is difference between three.js renderers? Which one is faster? Which one is more standard and cross browser? How the svg renderer and dom renderer work? I have different result when I use webGl instead of canvas renderer for below code so why it should happen?
cube = new THREE.Mesh( new THREE.CubeGeometry( 200, 200, 200, 1, 1, 1, materials ), new THREE.MeshFaceMaterial() );
Is it a big difference between canvas and webGL? which one I should use for a high viewed website?

Upvotes: 10

Views: 8840

Answers (2)

STEEL
STEEL

Reputation: 10017

go with WebGLRenderer as its future proof and imp is most THREE.js methods works in it.

For e.g. ParticleSystem does not work in CanvasRenderer

Upvotes: 2

Mikko Ohtamaa
Mikko Ohtamaa

Reputation: 83788

You really want to create applications which only support WebGL if your goal is to create 3D graphics. Other Three.JS renderers are more like hacks and proof-of-concepts than something which can give you real 3D. If your goal is not to create stunning graphics then you can simply use static PNG images, GIF animations or YouTube clips and have better backwards compatibility. <canvas> rendering backend is useful for very very simple graphics only (like a spinning cube without a texture) and having <canvas> as fallback is not going to work in many cases.

For example, https://tinkercad.com/home/ is WebGL only web application. Their estimation in webshaped.fi conference was that around 50% of site audience can access WebGL content. That may sound low, but it is still much higher then people who install an application on their mobile or desktop, so the conversation rate deploying 3D using WebGL is higher than thru other deployment mechanisms.

Also see http://webglstats.com/

WebGL is also a future-proof technology - it won't go away. Currently you mostly target desktop, but it is just matter of time, 2-3 years, before mobile adaption is reality.

Upvotes: 16

Related Questions