Callback after scene is completely ready


do we have the possibility with threejs to retrieve a callback once the scene is ready?

With Babylon there are the functions isReady and executeWhenReady:

This function will check if the scene can be rendered (textures are loaded, shaders are compiled). Delay loaded resources are not taking in account.

This is because I use rendering on demand, and when the scene changes, I don’t want to render again until everything is really ready. So not only all textures should be loaded, but also all materials compiled, objects repositioned, etc.

Is there a way to implement this?


let’s turn it around, how can you not know that your scene is ready? you are the one that’s loading these assets, you need to commit a mistake in order for you to not know when they’ve finished loading/parsing. imo this indicates an architecture problem, good architecture flows one-way, top-down, uniformly, when you arrive at the bottom your app is ready to respond.

Fair enough. I am already waiting until all textures are loaded but this still leads to the situation that the model is white for a few milliseconds until it receives its material. How can I avoid this?

In addition to that is there another way in r3f to pause the rendering without changing the frameloop prop of Canvas?

If you’re using a shared LoadingManager for everything, you can use its callbacks to know when those things have loaded. You may (optionally) want to precompile shaders and upload textures to the GPU using methods on the renderer.

In general three.js loaders return objects that already have materials and textures. If you’re modifying materials in code after that, you’ll need to include that in your setup timing.

if you use fiber then loading is taken care of, you control the succession of things with suspense, if everything is inside the same suspense bound than all components will render together once everything has loaded. say you have a model, a texture and an environment map inside <Suspense> then it would be impossible for the model to come before the envmap, or the envmap before the model, they’ll all go live in sync.

can you show me how you load the texture and apply it to the material? bc drei/useTexture goes out of its way to have everything ready without FOUC, it pre-uploads the images to the gpu.