4

I'm about to start a Web application that will use interactive generated 3D content. Aim is to let it run natively in the browser, i.e. no Flash is allowed, only JavaScript + HTML5.

Apart from using pure WebGL it's better to use a lib that will offer a more high level interface.

The approach of X3DOM looks great for me - and it looks like it's supposed to become native in the browser and the lib will pave the road.

But after my first impressions I'm not sure if it's lightweight enough. Apart from the 400kb JS-File it slows down Firefox.

The features I need are not many. The whole scene set up could be easily done by "hand". But I need user interaction including to figure out where the user clicks. And later I want to be able to load and insert 3D objects in a common file format.

PS: Browsers of choice are Firefox and Webkit based ones. Desktop and Mobile ones. I don't care about IE.

PPS: Yes, I know the question: WebGL Framework

Community
  • 1
  • 1
Chris
  • 2,888
  • 4
  • 34
  • 50
  • To add more informations in my case: I'm familiar with OpenGL from the old days, i.e. without shaders. But that'd be no big step for me. The necessary maths are also no problem in my case - I'm already needing it to set up the data to show :) – Chris Dec 04 '11 at 21:59
  • This question has been asked quite a bit and there is an extensive list [here](http://www.khronos.org/webgl/wiki/User_Contributions). Also, personally I would put in my vote for Three.js because its free, actively developed and seems to be the most popular. – Jesse Good Dec 04 '11 at 22:23
  • 3-4 years after those answers i have to add this : x3dom is surprisingly simple for simple scenes, it can be a good choice. But it is limited, if you need to create your own functions for example, add event listeners etc. Threejs is now over 400Ko but you can make your own build from the source files. So for me it is Three.js without any doubt, still after a first year in. Depending on your app you can change rendering parameters to increase performance and fallbacks are also available. – Atrahasis Mar 21 '15 at 22:41

3 Answers3

6

X3DOM is great when you come from an X3D background (and developed by great people), but if you have no preference watsoever, Three.JS would be my pick.

wildpeaks
  • 6,918
  • 2
  • 25
  • 34
  • I'm now using Three.JS. Apart from lacking documentation (=> read example code and ask at IRC) I'm very surprised to hardly see projective geometry / homogeneous coordinates there. This might limit me later, but till now it does what I need and even gives me shadows for "free". – Chris Feb 23 '12 at 21:37
4

I looked at most WebGL frameworks just last week, and it indeed seems almost every one of them is in the 300kB range. That's too heavy for me, too. Luckily I found lightgl.js which has everything you need to get started in 28kB, MIT license.

The main thing for me is just abstracting canvas, shader and texture initialization. But lightgl.js does also have some mouse handling and model loading etc.

StackExchange saddens dancek
  • 3,202
  • 1
  • 23
  • 37
3

i think the decision boils down to: do you want to have a more design or programmer approach.

x3dom: its leveraging of x3d for describing the scene lends itself to a more designer approach, with just the adding of the x3dom css and js one can do this :

<X3D><Scene><Shape><Box/></Shape</Scene></X3d>

three.js: only allows for scene generation through javascript, and a lot of additional code is necessary just to set up the canvas. view the source of this simple box example: http://stemkoski.github.com/Three.js/Template.html

neither way is wrong, i prefer designing the scene and then using js when needed for any computations.

drfrog
  • 337
  • 2
  • 9