Scene performance debugging: Sandbox vs Local Framerate difference

Questions
1

Hello,

I’m working with a single model, and I noticed some differences with my local server and sandbox, both using the same version of BabylonJS. I’m consistently getting ~10fps (30%) less on local server.

Using same .glb and .env files as below:

  • Sandbox: drag and drop
  • Local server:
    • working canvas initialization
    var canvas = document.createElement("canvas");
var engine = new BABYLON.Engine(canvas, true);
var scene = new BABYLON.Scene(engine);
var camera = ...
engine.registerView(outputCanvas, camera, true);
    • using SceneLoader.ImportMesh for .gltf and BABYLON.CubeTexture for .env

Comparing the inspector:

  • Meshes selection is 10x higher in local server
  • Frame total and GPU Frame time is way higher while Inter-frame is lower on local server
  • it seems some workload is unevenly distributed between CPU and GPU

image
image653×1206 38.9 KB

I looked into the sandbox source code, but didn’t notice any additional configuration. Any ideas?

2

Hi!

NGL, I don’t have the precise answer however I believe there might be something extra running (live reload features) when on local dev. Maybe you could create a Performance snapshot in the Developer Console and compare them for both environments.

3

It looks like you are relying on engine views which involved extra copies you do not have in the sandbox and this would definitely add a performance penalty ?

4

UPDATE: Found the culprit - do not include the Babylon engine and scene objects to Vue reactive data like me :slight_smile:(RTFM)

Both good points, thank you for your feedback.

@sebavan I was expecting some penalty, but wasn’t sure how much that would be. I don’t need engine views for this case so I’m removing that.

I’ve updated the app to use a DOM canvas instead of engine views, and created a production build to rule out dev server overhead to minimize differences. Both had a positive effect in FPS.

And @roland great tip, with performance snapshot I think I found the difference, there are a couple extra function calls on my local server (on the right) which I think is the culprit.

image
image2560×1394 431 KB

This gives me a good chance for debugging further, thank you!

3 Likes