Best option for 3D on the web?

Support Other Software
41

Disclaimer: I’m a regular contributor to the three.js library, an author of A-Frame VR, and an author of the glTF format.

glTF and X3D are at very levels of abstraction, and if you’re choosing between the two you’ve probably misunderstood something :wink: … A glTF file represents a 3D model, similar to an FBX or OBJ file, but optimized for use in a realtime engine. It can contain animation, but doesn’t have any sort of interactivity. It’s meant to be loaded into an engine, perhaps with other models, and it doesn’t really matter what engine – three.js, BabylonJS, A-Frame VR, and even native engines like Unity and Unreal can all load glTF models. For the very simplest way of displaying a glTF model on the web, if that’s what you want to do, check out the <model-viewer/> component, similar to an HTML <video/> tag for 3D models.

X3D is more complex than just a model format – it also includes scripting, audio, video, and interactivity. See a full comparison here or here. It’s almost more similar to a whole application like an A-Frame VR page than it is to a model format like glTF. You could even load a glTF model into an X3D scene. As a result of that more complex scope, engines like BabylonJS and A-Frame don’t support X3D, and support in three.js is very limited.

If you want to do 3D on the web, I’d suggest these steps:

(1) Figure out what sort of application you want to build. Just view a model? Something interactive? VR? Build a whole game?
(2) Based on that, choose a 3D engine that is reasonable for your goals and skillset. ThreeJS, BabylonJS, A-FrameVR, Unity, X3DOM, PlayCanvas, and others might be reasonable choices here.
(3) Once you’ve chosen an engine, decide how to export content to that engine.

For three.js, BabylonJS, and A-Frame VR, using glTF is the officially recommended way to load a model. If you want to use X3DOM, then X3D is probably the right choice (I’m not personally familiar with either, so maybe someone else can comment). If you’re building in Unity and packaging for Web, then glTF is an option, but FBX might be easier given the long history of support there.

Hope this is helpful. :slight_smile:

5 Likes
42

Thanks for that long post, Don :slight_smile: (I knew most of that actually :slight_smile: ) , but I think what I’m trying to decide between, is a game engine (or Verge3D) and X3D, ie. X3DOM. As I said, with an engine, you build inside a GUI environment, which is looking attractive to me for the moment, as opposed to writing code, for X3D. I’m just wondering which one is “better”, if there even IS such a thing? :slight_smile: I personally feel that authoring a world is something better done graphically rather than scripting it, it just…makes it more human. Any thoughts?

43

…Oh, and will it actually be possible to author a whole X3D world inside Blender, in 2.8?? (exporting facility, amongst other things…?)

44

That’s a bit of an over-generalization of 3D engines — three.js and BabylonJS are engines, arguably, but both usually involve writing code. A-frame also involves code, but it’s much more approachable if you haven’t coded before, and has a GUI for debugging. PlayCanvas has a GUI, but you’ll also be writing some code there.

Unfortunately I know very little about X3D, X3DOM, and Verge3D.

To get help on this question you’ll need to explain what you mean by “authoring a world” – there are so many tools in part because different uses have different needs. You can create a complex scene in Blender and view it without writing code. If you want something more like a game, with NPCs and a story, I don’t know of any mainstream tool that will let you avoid coding entirely.

45

Oh I don’t mind coding - just, sometimes a GUI is better, sometimes it’s not.
By “authoring a world” I mean, say, there are some 3D models in my scene, and dragging the mouse would rotate them, in 3D - ie. around the Y axis. Also maybe, say there’s a box, and if the user clicks it, smoke will emanate from it - and this smoke will keep on emanating WHILE the user , if they choose to, drags the mouse. (all this inside the browser obviously).

What’s a “NPC”? :slight_smile:

46

By “NPC” I mean like other characters with dialog, or enemies to fight, or other game-style things. Sounds like you don’t need that though.

If viewing a 3D scene and rotating it is the main interaction you want, I think that <model-viewer/> or Sketchfab’s embed feature might be the easiest and most functional way to start. The other tools you listed can do it, but they’re probably overkill.

And just for warning in advance, simulation effects like smoke are probably not going to export to web with any of these, or at least none of the ones I’m familiar with. There is no common way to export that sort of thing from Blender. For a rough idea of what is likely to work on the web, see the docs on the glTF 2.0 exporter.

47

Er - what’s <model-viewer/> ?

But besides that, hang on - after yesterday’s bombshell announcement by Google of Stadia (with THEIR OWN CHIP!!! (with AMD)), I’m starting to wonder whether I should mess with aaall the above at all - if the browser just becomes a “thin client”, with as much power as you want on the serverside, then why do the number crunching client side in JS at all?? I don’t know the stats, but I’m guessing there’s still a HELLOFALOT of people who don’t have fancy GPUs, or even any 3D hardware at all - specially in my country, here.

And btw, this is Nvidia’s webpage:

What are your thoughts??

48

<model-viewer/> is a simple way of putting a 3D model on your webpage: https://googlewebcomponents.github.io/model-viewer/.

Running GPUs on your server is an expensive thing to do. I’m curious to see how Stadia plays out but for most developers it’s still going to be better to distribute that load across devices rather than hosting GPUs on servers, even low-end phones can run WebGL these days.

49

…So you think there’ll be 2 types of games one can play, then - 1) locally, after downloading it or whatever, and 2) Unbelievable photoreal graphics STUFF, which one buys rental, ie. in the cloud?? And you think both of these are going to coexist? (Of course, it remains to be seen how Stadia will be priced…)

50

Well, (1) certainly already exists. I have no informed opinion about (2) and the Stadia announcement yesterday, it seems too early to say.

1 Like
51

WAAAAY too early…

52

Don - I was wondering if you could tell me - is it possible to program graphics with Node.js, using Vulkan? Would you know…? :slight_smile:

53

It’s possible; see https://github.com/maierfelix/nvk. But I’ve never used this myself.

1 Like
54

Yeah, that’s the site I found with Google too,…but are there any books on programming Vulkan with JS? How else is one supposed to learn it, then…? I can’t seem to find any… :frowning: