GPU Performance optimizations on a complex scene

This is a scene from my game, and I use several babylon.js components and I see the GPU usage is around 30% on my desktop (Nvidia 3080TI) and around 65% on a midrange laptop. There are no known CPU issues as I have done some CPU optimizations.


  1. Is there any BABYLON.Engine or BABYLON.Scene properties I should consider for better performance for GPU performance ?

  2. I use a lot of shadows generated by BABYLON.CascadedShadowGenerator with this setup

self.mainshadow = new BABYLON.CascadedShadowGenerator(1024, light);
			self.mainshadow.forceBackFacesOnly = true;
			self.mainshadow.numCascades = 0;
			self.mainshadow.usePercentageCloserFiltering = true;
			self.mainshadow.cascadeBlendPercentage = 0;
			self.mainshadow.freezeShadowCastersBoundingInfo = true;
			self.mainshadow.filteringQuality = BABYLON.ShadowGenerator.QUALITY_LOW;
			self.mainshadow.shadowMaxZ = 35;
			self.mainshadow.autoCalcDepthBoundsRefreshRate = 60;
			let smap = self.mainshadow.getShadowMap();
			smap.refreshRate = 2
  1. I use BABYLON.GPUParticleSystem for effects on the environment (mist, flames, gas etc) is there any settings here I should consider for performance ? I use “addSizeGradient” to control the visibility/lifetime for the particles. As there are limited control on a GPU particle. A typically scene can have around 150k particles.
1 Like

The best way to start with questions like these is to get some hard data on performance — the stats tab of the inspector being one way - so that you can know and understand where most of the Frame times are spent in rendering.

For example,
Are the number of draw calls a problem, or is the number of instances the problem? What is the breakdown of rendering/frame timings?

If you’re looking to really focus on the GPU, Spector.js is a Chrome extension you should absolutely leverage, as it will tell you specifically what’s happening on the GPU at any given point in the render process




Thanks for the reply, I’ve tried that. But that does not work as spector.js does not support offscreencanvas. I have offloaded babylon.js into a different worker thread.

My thoughts are not on draw calls, instances etc. more generally options that can affect the GPU performance on the scene described.

Ok - You’ve not related to us very much about your scene or it’s setup so we’ll just stick with generic advice for now :slightly_smiling_face:.

One thing would be to determine whether/what problem you actually have in the first place. What’s your target frame rate, and on your tests, where do the actual gameplay frame rates end up? From your OP, it’s unclear what problem you’re trying to solve, as GPU %’s don’t tell us much about the system being described or the metrics used to measure performance. If you can fill in some of that context, we’ll be able to provide more specific advice :sunglasses:

There’s similarly not much to say about your shadow generators without additional context - all I can speculate on would be whether you need the resolution to be 1024 for those rather than a smaller value.




Thanks for the feedback, there are no problem in the scene and the target framerate is stable 60fps.

I seek advice if there are any options for the engine, scene, CascadedShadowGenerator, or gpuparticles that I may consider for better GPU performance.

I ask this as I see the GPU may become a bottleneck on low-end computers.

I’m sorry I cannot provide more specific information :slight_smile:

Many thanks for the followups!

1 Like

The BabylonJS docs have a section on scene optimization..

Another useful tool to look at is the BabylonJS.SceneOptimizer.

In the end though, nothing will be better than actually testing your game out on low end hardware to see how it actually performs. There’s not much utility - and no little harm - that can come from trying to anticipate this sort of unknown!



Another thing you could try is using the GPU particle editor PG to test out a scene with just that running on your devices, for comparison.

For instance, on my laptop if I take the GPU particle count down to 0, then the average GPU frame time is only 0.2 ms and the GPU usage is about 15%. But with 150K active GPU particles, the average GPU frame time increases to 5.65 ms and the GPU usage increases to about 45%.

The below playground for example will very quickly increase the active particle count to whatever value you set the “active particle count” slider to (currently set to 150K like your scene). :slightly_smiling_face:

Edit, PS, if you’re concerned about the higher GPU usage of the GPU particle system, you might be able to create a similar effect with the standard particle system that uses the CPU for animation instead of the GPU, but you prob wouldn’t be able to have nearly as many active particles…



I do not see the big change in GPU when changing particles from 150k to 50k, so I keep it like this for now as it is visually better :slight_smile:

I will look into the scene optimization and see if there are anything I can do.

As there are really not an issue yet, I will post an update later where I tell how things are going on the performance wise :slight_smile:

Many thanks!