Hi Community!
Have been having a lot of fun working with and learning Babylon.
The issue:
On my scene, I have a ton of clone meshes to which I apply a standard Material created in Babylon. To achieve better performance I added a freeze/unfreeze loop.
But now when I hover in/out of these clones and change their material, sometimes they disappear and reappear a few frames afterwards…
My code in React is just one call to several regular babylon.js files.
One of which dedicated to optimizations which only receives a reference to the scene.
Here’s a fully functional working PG just to illustrate the structure / steps I’m taking…
I read something about materials needing to be unfrozen but I’m confused and not sure what to look into.
Hoping someone could give me some pointers here.
Thanks!
For this kind of scene, using Thin Instances Thin Instances | Babylon.js Documentation (babylonjs.com) instead of clones is much more performant and you can use the same material for all of them so you don’t need to worry about freezing
You can change most of the characteristics of a single material with thin instances through Colors, textures, transparency, all can be changed and still use thin instances
I didn’t have such unrestricted view of thin instances but doing so may require a lot of work, never the less, I will take a deeper look it.
However, this issue only appeared after I added the freeze / unfreeze method that pushed FPS to 60 and is working fine, except for some materials which take longer then others to update.
An example:
I hover over A and then B. B refreshes quicker than A which is not rendering.
Happens with object fully in frustrum some are clones, some are original and unique (created with MeshBuilder).
If I comment that code section the issue is no longer present but runs slower.
This playground has more drawcalls then my project and this issues is not present.
I don’t suspect its a performance issue I think it might be something that gets turned off.
So, to reformulate:
What might I be missing in my freezeActiveMeshes() and unfreezeActiveMeshes() loop? Is there something else I should add to the loop?
Or before / after the loop?
…
Oh, I’m using Babylon version is 5.34 (just in case it matters)…
Yup, the Thin Instances part is more of a general recommendation, because your scenario seems pretty suited for it and it would improve perf further in your app
But about the issue with clone, does it only happen in your React app? I’m testing here on a laptop and I didn’t see the spheres disappearing.
I’m also going to bring @Evgeni_Popov here as he probably knows what’s going on
So I updated the Babylon version and in console it outputs:
“Babylon.js v5.53.0 - WebGL2 - Parallel shader compilation”
The problem still happens…
Re-testing the above PlayGround was able to replicate the issue and noticed that it mostly occurs when you have the console open in the browser…
On my React App closing the console the issues is less frequent, only happenning on a particular type of object… Which I believe may be due to condition checking.
and you can use the same material for all of them so you don’t need to worry about freezing
