I have a lot of gltf models. After loading, FPS is very low, only 3fps. How to tune

Questions
1

I have a lot of gltf models. After loading, FPS is very low, only 3fps. How to tune

2

Well. Some things that you can try (from 3D standpoint).

  • Optimize your models if possible (reduce polycount)
  • Reduce textures size where possible and as much possible.
  • Merge multiple objects into one. For example if you have several objects that could be grouped together without affecting the purpose of those models being in the scene. And especially if the models share the same material, those models should be merged into a single object (basically, this reduces the number of draw calls, effectively optimizing the scene).
  • Use instances if possible.
  • Use draco compression on the gltf files

You can also read through this doc to check if anything helps you

3 Likes
3

I used BABYLON.SceneLoader.ImportMeshAsync to import my model in parallel, and the total size of all models was around 450M, and after each task was loaded, it was called.

.then(res=>{BABYLON.Mesh.MergeMeshes(item.Meshes, true);})

Model merging, but it doesn’t seem to work

4

Try to simplify your meshes with auto-lod or reduce the maxZ property of your camera and add fog, thus reducing render distance. Replace some meshes with sprites. And use engine.setHardwareScalingLevel to reduce the number of pixels rendered.

5

Have a look to the browser console in case you get some errors there.

6

image

image
image1137×450 15.9 KB

let res = [‘https://cdn.cp.adobe.io/content/2/content/93f19c5b-5587-4f4f-95bd-99295214aade/version/0’] //Here is the URL of gltf
res.forEach(name=> {
BABYLON.SceneLoader.ImportMeshAsync(null, name, ‘’, _that.scene).then(res => {
console.log(res)
// BABYLON.Mesh.MergeMeshes(res.meshes.filter(m => m.getTotalVertices() > 0), true, true);
res.meshes.forEach(item => {
item.doNotSyncBoundingInfo = true
item.freezeWorldMatrix()
// item.convertToUnIndexedMesh()
item.cullingStrategy = BABYLON.AbstractMesh.CULLINGSTRATEGY_BOUNDINGSPHERE_ONLY
BABYLON.Mesh.MergeMeshes(res.meshes, true, true);
})
})
})
My model has a total of 15 gltf files, with a total size of about 450m. It has been loaded, but the special card, FPS, has only 3 frames. How can I optimize it

This is the optimized mesh
image