Import Mesh - application hangs while geometry is processed


I’m reasonably new to BabylonJS, so, sorry if this is something obvious :slight_smile:

I’m importing a bunch of meshes (on-demand by the user) and since some of them are relatively large, I’m first importing a lower LOD version, then replace it by the higher LOD version afterwards via callback from ImportMesh (also tried via ImportMeshAsync which made no difference).

The issue is that while the imported mesh is being processed, the entire application just hangs - is the actual processing not running async? Or is there a way to do this? Since this affects potentially dozens of meshes, it is super problematic from a user perspective (and defeats the point of loading the lower level detail versions since the app just hangs).


IF i well understood, this is probably due to the fact that javascript can’t (yet?) be multithreaded. But wait for a more power-user answer :smiley:

The process is:

  1. Download geometry & textures. You are actually downloading the geometry more than once. The downloads themselves do actually occur in a browser background thread, but the geometry is parsed & loaded into the GPU in the UI thread. Doing the smaller version first does bring up the scene quicker by the difference in download time though.

  2. Once a texture file is downloaded. It is processed both on the cpu & gpu (creating mipmaps & compiling shader). Right now, for most browsers, the gpu time cannot be done in a thread, but there was WebGL extension to compile shaders on worker threads added. Chrome has it implemented I think, so maybe see if there is a difference between browsers.

Also, it might be less work to not have a material on the larger versions, but rather assign the material from the small version in the swap. Do not know how much it will help, but should be fairly easy to try. Measuring might be tough though, since async is pretty hostile to that.

Finally, you might not want to hear this, but you might have too much detail in your geometry, and are trying to fix everything later right on the user’s machine.

I use Blender. What I do when getting an asset ready is keep a copy (a .blend file) with everything at maximum resolution. I create a series of exports where I apply what is called in Blender a ‘Limited dissolve’ using UV as a delimiter. This function takes an angle to limit as to what is fair game to merge. I start with a small angle and keep increasing until you can see real differences as the expected distance from the camera the mesh is going to be. Then use the one just before.

1 Like