What is the correct way to render on demand

Questions
22

Thanks, @Evgeni_Popov!

That‘s better. Do you have an idea why it slows down faster than with normal render loop?

https://www.babylonjs-playground.com/#UNB24W#8

EDIT:

Setting the parameters for scene.render() seems to fix that problem: scene.render(false, true): https://www.babylonjs-playground.com/#UNB24W#10

23

I think you can remove the manual call to camera.update() and pass true as the first parameter to render:

https://www.babylonjs-playground.com/#UNB24W#11

5 Likes
24

Hi,
nice thread! The example by @Evgeni_Popov is done with the ArcRotateCamera. Any chance to do it with other cameras such as FreeCamera, too? FreeCamera does not seem to expose an inertia value.

25

It seems you can test cameraDirection and cameraRotation:
https://www.babylonjs-playground.com/#UNB24W#13

2 Likes
26

nice, thanks a lot! :slight_smile:

27

Small improvement - Hardware Scaling on Movement. Interesting would be PostProcessing like SSAO that appears only on first render, too.
https://www.babylonjs-playground.com/#UNB24W#14

2 Likes
28

But that will cause some input doesn’t work, such as the moving by the keyboard in FreeCamera, having a look https://www.babylonjs-playground.com/#UNB24W#13, moving by the keyboard (arrow keys) doesn’t work, after uncommenting the camera.update(), anything works well.

After searching the source code, I found keyboard inputs checking (camera._checkInputs()) only called by camera.update():

So I think camera.update() is needed.

29

We can use camera.onViewMatrixChangedObservable to do this so that you don’t need special logic for different cameras:

https://www.babylonjs-playground.com/#UNB24W#15

This is also a bit lighter on the CPU when nothing is happening since it only calls camera.update().

2 Likes
30

It works well, thanks a lot!

1 Like
31

Most of the solutions shown here do no longer work since version 5.29 (see On-demand rendering solution broken since 5.29)

32

cc @PolygonalSun

I don’t see why camera.onViewMatrixChangedObservable solution won’t work. @7om Do you have a repro?

33

Depending on what’s going on in your scene, you may want to tie into other events like animations or pointer events (ie: hover events, pointer click) where a scene changes without the View Matrix notifications.
react-babylonjs/RenderOnDemand at master · brianzinn/react-babylonjs (github.com)

Also, in the engine component there is an opt-in mechanism to not render if the canvas is not visible (ie: scrolled off screen):
react-babylonjs/Engine.tsx at master · brianzinn/react-babylonjs (github.com)

maybe those snippets will be of use. cheers.

34

Sure, just test your own PG: https://www.babylonjs-playground.com/#UNB24W#15

It is broken for me. Sometimes - when I click and drag - the view does not change. When I release the mouse button, the view jumps to the new position. @PolygonalSun gives some explanations on what has changed in the thread I mentioned above.

35

Bug filed: onViewMatrixChangedObservable not firing with non-standard render loops · Issue #13551 · BabylonJS/Babylon.js (github.com)

We will fix it soon. Sorry for the troubles.

1 Like