Stop render loop and keep last frame rendered (multiview)

hi. i have many scenes which are rendered to many canvases. the problem: i have to switch between them but keep what is rendered. how to stop rendering completely but hold last frame? i’m handling it with snapshots like:

const lastFrame = previewCanvas.current.toDataURL();

just looking for a simple solution.
searched here Optimizing Your Scene | Babylon.js Documentation and here Requests about how to set max fps below 60

stopping the render loop (and not disposing) should keep the canvas as is. For example:

Babylon.js Playground (

So you still maintain the last frame rendered. Are you doing something else?

1 Like

Like in the playground above, this should stop correctly the render loop:


For more details here’s a guide from this forum:

Check out last comment about multi loop.

1 Like

you’re right. engine canvas (which goes to constructor) keeps last rendered frame but registered canvases are not on engine.stopRenderLoop(). i took your website demo views: Babylon.js - Multi views demo and modified it with timeout and stop render loop:

      // Create a working document
      var canvas = document.createElement("canvas");

      var engine = new BABYLON.Engine(canvas, true);

      // Set the default canvas to use for events
      engine.inputElement = document.getElementById("renderCanvas0");

      var scene = createScene();

      engine.runRenderLoop(function () {
        if (scene.activeCamera) {

      setTimeout(() => {
      }, 3_000);

all views were reset after 3s:

can you suggest?

Hello! The multiview scenario should have worked as you’ve put here, but there was a bug with the engine, it will be fixed by: Cancel any pending animation frames on stopRenderLoop by carolhmj · Pull Request #14102 · BabylonJS/Babylon.js (


You can take a screenshot of the view(s) before ending the render loop and create img html elements with a z-index higher than the canvases. Position and size these imgs over the canvases. Display the screenshotted content in the imgs. Remove the imgs when engine loop/loops is/are resumes. Maybe you will need to wrap the imgs in a div.

1 Like