Performance loading large GLBs | reduce frame drops and load time

Questions
, ,
1

Our project requires that we load user uploaded content that tends to include very large models in the form of GLBs. We pre-process the content to reduce draw calls, but don’t do triangle reduction. My goal has been to find a balance between reducing jank (I’d rather the UI doesn’t freeze up for multiple frames), and reducing total load time.

Because of the draw call optimizations, we tend to have a few very large meshes which result in large expensive calls when constructing the geometry. For example, one call to _createVertexBuffer might take 200ms. Similarly, we’re using Havok for improved ray casting performance on these large meshes and a single call to HP_Shape_CreateMesh might take 600 ms.

I’ve tried implementing a sort queued gltf importer, so that the work is spread out over time, rather than having the entire UI freeze up for seconds at a time, but I’d like to do better. Without the ability to move this work into a separate thread, I’m at a loss for where to go from here and would appreciate any ideas people might have about how to think about the UX and technical improvements we could consider.

2

You would have offscreen canvas if your heavy processing could be decoupled from Babylon.

But if the problem is loading files, then I don’t see what can be done, because the loading must happen in the same thread than where Babylon is hosted…

Maybe @RaananW or @sebavan will have some ideas?

1 Like
3

I wonder if the LOD extension could be helpful here… Progressively Load .glTF Files | Babylon.js Documentation (babylonjs.com). Through, since the content is user provided, you’d have to first process it somehow to create the LOD meshes and just then load the file.

4

Apart of a queue as you suggested, there is little to do here. Just as @Evgeni_Popov said. This is all running on the main thread, and can’t run anywhere else, as the data is needed on the main thread.