Threejs switch scene

0
votes

I've a project that actually loads and render 3 different scenes in three different area of the site. At the moment, every time i need to change scene, i remove the canvas (an all Threejs listeners and iterators) and render the new scene from the scratch.

Is it a good practice or there are performance benefits from creating a unique scene with it's renderer, and loading inside it the different meshes, lights and cameras from the three different scenes?

Anyone have already test a similar scenario?

2
three.jsscenerenderer
Can you please provide some details about what you mean by "3 different scenes in three different area of the site"? It sounds like you're trying to have three different canvases showing three different scenes, but I could be wrong. – TheJim01
Scenes are NOT showing together, only one scene at time. Suppose you have three site pages with three scenes (but browser doesn't reload) – Mars Spider
In that case, why not just empty your scene of "page1" data, and repopulate it with "page2" data? (Or, if memory allows, keep multiple scenes, and pass them individually to the renderer as your page changes?) – TheJim01

2 Answers

0
votes

Are you looking for something like this?

If you are looking for showing one scene at time, I think the best option is to create the scenes and render only the selected one. See THREE.WebGLRenderer.render().

0
votes

Performance wise it would probably be slightly better to use a single renderer-instance and different scene-/camera-objects passed to it's render()-call and (if necessary) relocating the renderer.domElement on your site. That way you don't need to have multiple canvases and rendering-contexts around and the renderer may be able to cache a few webgl-related things. This method also has the possibility to reuse things like materials across scenes.

However, the performance-difference should be minimal and only (or at least mostly) initialisation-cost in a range of max. 100ms (depends of course on what exactly you are doing, but this would be my guess).

So if it feels better to have everything isolated (and there might be good reasons for that as well depending on how your app is built): Just keep it that way and measure if it has any negative impact (my guess: it probably won't).