Optimisation tips


I’m looking to deploy a mobile version of a project I recently built. I’ve done a lot of optimisation of the 3d models and used instances etc, but I’m still struggling to get it to load on a modern iPhone;

I’ve started stripping back the file and I think I have two issues.

First is my use of lots of different post glow effects, to highlight objects. I think I can solve this with coding one glow channel that switches depending on what is highlighted.

I think the second is the use of lots of different GUI panels. Is there something I’m missing with how they are loaded in and out, is there a way beyond .isEnabled to stopping them causing additional processing when they are not visible.

Thanks in advance for your help!


Hello! First of all your scene looks super nice, great job! :smiley:

I tried running a profiling session here and I definitely see the post effects taking a huge chunk of time, so that’s going to be your major point to optimize. I didn’t see GUI taking much on the timeline through, are the profiling results different on a phone?

I think you’re probably using it already but since you haven’t mentioned: are you using any of the performance priority modes yet? Optimizing Your Scene | Babylon.js Documentation (babylonjs.com)

1 Like

Hi, thanks (again!) for your help. I’m new to the profiler, so I think I need to go and do some reading up to get a better understanding of how it works. And nope, I havent tried the performance priority nodes either yet, looks like there’s more reading up for me!

Glad to hear that you think the GUI isn’t too resource intensive though.

1 Like

The GUI can get more intensive if it has controls attached to meshes, since in this case we have to update it more frequently, or if there are heavy image textures, since we have to draw them to canvas and that can be CPU intensive, but your example doesn’t seem to have any of them :smiley:

1 Like

Hi @Scubbs!

First of all I would review the geometry of the scene:

Is it really necessary for the arrays to incorporate the output cubes?
One option could be to use simplifying the model and using a normal map to simulate the effect.

On the other hand, I would test the scene with minimal use of visual effects, for example, try turning off the Glow.
Check the Glow settings, it´s not recommended to use a size greater than 512

I also see that you are using lighting and shadows, have you tried to make the Lightmap of the ground?
In such a way you could disable ShadowGenerator since I don’t think it will add much to the scene and it would help you improve performance.

Finally, in the documentation there are some techniques to help you optimize your scene (freeze meshes or materials, doNotSyncBoundingInfo, autoClear…)

1 Like