Please help me to optimize the rendering performance

Hello, talents!

I’m currently working on the 3D multiplayer online game project, and I have so many 3d objects in the scene. But the rendering performance is very low.

Do you have any recommendations or method to improve this?

Thanks

Hello! Instancing, batchedmesh maybe with 3d texture, lod, Impostors with 3d texture.
One instancing transparent sprite (1 draw call) with distance sorting: explosion, bullet trace, smoke, fire.
One instancing transparent sprite (1 draw call) without distance sorting: for lights at wall.
One instancing no transparent sprite (1 draw call) without distance sorting: bullet impact at wall, fragment of flying ground after explosion.

1 Like

What kind of program are you developing? Something with a big 3D world filled with 3D objects to explore? Or something where all the objects are nearby (like arena combat)? Or something where you are moving from one detailed room to another?

First you have to identify what is causing the performance drop - big textures? complex objects? too many draw calls? piling post-processing effects? javascript single-threadness? ineffective algorithms? ineffective memory usage? bad handling of user interraction? And once you figure out where the problem is, then you can focus on optimizing it.

Also, check the legendary Lewy’s The Big List of three.js Tips and Tricks! - it is somewhat old, but still there is a lot of truth.

1 Like

Default raycaster for object with 10.000 triangles found ray intersection for 0.70ms.
With BVH raycaster maybe 0.01ms.
Can you send screenshots.