Browser turned black for a few seconds then restored

[Antony]

I incorporated Babylon js in my web site to show 3d characters, but when running for a few minutes the browser may turn black for a few seconds then restored. The console showed the web context lost then restored. I have checked all memory leaks and fixed but the problem persists. I can only repeat this issue on windows but not Linux. Any idea why and what can I do to prevent this? Thanks.

[sebavan]

It is most of the time a memory leak unfortunately or simply an excessive memory usage

It could also be a driver crash. Can you repro on other computers ? if yes can you share a repro ?

[Antony]

Hi sebevan,

I figured out that it may due to I dispose the character’s related resources (meshes, skeletons, animation groups) and recreate it (for some reason I have to do it this way) whenever something changed with the character properties. This could happens many times, and I noticed that the memory wasn’t released. What is the proper way to dispose a character’s related resources completely without disposing the scene? Thanks.

[sebavan]

Maybe you forgot to dispose materials and textures ?

[labris]

@Antony

What is the proper way to dispose a character’s related resources completely without disposing the scene?

Way to dispose all the assets loaded from a file (GLTF) leaving intact the rest of scene

I believe the easiest way which gives the full control is to create an array with the list of imported meshes. When you need to dispose the loaded GLTF just dispose meshes from this list until it will be clear. Mesh.dispose() has the flag disposeMaterialAndTextures to dispose associated materials and textures when true - Mesh | Babylon.js Documentation To dispose animations associated with the mesh one needs to go through the array of mesh.animations - Mesh | Babylon.js Documentation

Please don’t use for-each cycle since it will not work here for objective reasons.

To dispose meshes from an array use while

while(scene.meshes.length) {
const mesh = scene.meshes[0]
mesh.dispose();
}

The same relates to mesh.animations array.