Support of Canvas and WebGL (three.js) on moble devices?

Question

There's a wonderful 3D-application framework called three.js. As far as I understood it has a few render subsystems: based on Canvas and based on WebGL.

So, what about mobile devices support? (Android, iOS)

Answer 1

Regardless of three.js it is broken down like this:

The Canvas element can be used with either a 2D context or a WebGL context. threejs can use either the WebGL or the 2D context.

Most mobile phones support the 2D context.

Few support WebGL context yet. Firefox for mobile supports WebGL and is available for at least some android builds, and the BlackBerry PlayBook can use it too.

See:

http://caniuse.com/canvas (aka 2D)

http://caniuse.com/webgl

Answer 2

Update 12-12-2014 http://caniuse.com/#feat=webgl

• IOS8 will have WebGL enabled.
• Android browsers have WebGl enabled.
• However, if you want to create an app, you can use Crosswalk to run the app on the latest Chromium (which has WebGL enabled).
• Alternatively, CocoonJS has "Canvas+", which is a native android/iOS implementation of the Canvas element, including a virtual javascript environment. (In other words, a custom browser which can only render Canvas elements)

Answer 3

You can use Three.js on mobile, at least iOS and only using CanvasRenderer of three.js. WebGLRenderer won't work on iOS.

Try not to use textures, it slows a lot the framerate.
With simple colored meshes, it's working pretty well and it's fast.

I had a few tests with animated Geometry, primitives only though.
I could test it on iPodTouch 1G and iPodTouch 4G. Both worked well, with good framerate.

I couldn't try it on Android, but I think it's working too.