How to optimize a lot of meshes behind opaque object in camera frustum?

Questions
1

Hi
In my project , I build a lobby which has lots of rooms.
I found the absolute fps reduces when I turn left , camera targets to a wall and meny meshes behind the wall.The wall is opaque…

So I test in the playground.
https://playground.babylonjs.com/#IC6IRV#1

There are 10x10x10 spheres behind a plane, camera is top view or front view, the activie meshes is not changed and absolute fps is the same 118. All be rendered.

default
default874×1198 163 KB

And then I hide spheres with code mesh.isVisible = false. The absolute FPS of the top view is 1331.

isVisible_false
isVisible_false879×1198 36.5 KB

I also hide spheres with another code mesh.renderingGroupId = 10 .But the fps is 580.
Maybe active meshes are 1002 used internal memory.

renderingGroupId
renderingGroupId829×1198 35.2 KB

And if I don’t load these spheres,the fps is 5000.

image
image745×452 13.5 KB

So how to optimize a lot of meshes behind opaque object in camera frustum?
Maybe to download meshes and dispose and then to download again?
Is there auto hide the meshes behind a Wall in API?

Ps. Instance is not useful,because in my project the meshes are different .
MergeMesh is out of memory in the Playground…

2

You can try occlusion query Occlusion Queries | Babylon.js Documentation and see if that helps.

1 Like
3

Sorry I fogot to upload a img…
I had already done the test with occlusion Queries in the PG,
The FPS of the top view is 110 which is lower than default.
The FPS of the front view is 45 which is perfomance bad, maybe caculate to much in every frame.
I used these code setting with occlusionQuery

mesh.occlusionQueryAlgorithmType = BABYLON.AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE;
mesh.occlusionType = BABYLON.AbstractMesh.OCCLUSION_TYPE_OPTIMISTIC;
mesh.occlusionRetryCount = -1;
mesh.isOccluded = true;

occlusionQuery
occlusionQuery972×1434 191 KB

4

Unfortunately there’s no general solution for this problem.

If you can do it, organize your scene/objects in an octree or a BSP to lower the number of objects handled in a frame. In your example it’s not really possible but maybe it’s not representative of your real world situtation?

5

Thanks,
I think I solve it.

https://playground.babylonjs.com/#IC6IRV#2

The meshes behind opaque object won’t be rendered to use code mesh.setEnabled(false) and
container.removeAllFromScene().

mesh.setEnabled(false) FPS is 3000 which is better than isVisiable=false(caculate to render hiding)

setEnable_false
setEnable_false898×821 30 KB

Finally to use container.removeAllFromScene() FPS is 5600 which is the best.

contain
contain826×788 24.2 KB

My project is running for phone web, AssetContainer save me .

The List of To Hide Meshes

  1. removeAllFromScene() FPS 5600
    – only two sphere FPS 5200
  2. setEnabled FPS 3000
  3. isVisible FPS 1350
  4. renderingGroupId FPS 570
  5. default show FPS 120
  6. occlusionQuery FPS 110~45 (will be used together with AssetContainer )

ps.（pc：2600x + 1660ti）