feat: 423 enable on demand render mode usage

[alvarosabu]

Closes #430

Controls

• OrbitControls
• CameraControls
• MapControls
• TransformControls
• KeyboardControls
• PointerLockControls
• ScrollControls

Abstractions

• Levioso
• Text3D
• MouseParallax
• FBO/UseFBO
• ⚠️ Lensflare (see bellow feat: 423 enable on demand render mode usage #436 (comment))
• Sampler
• 🚫 useSurfaceSampler (see useSurfaceSampler is not a composable #440)
• Reflector
• ⚠️ AnimatedSprite (see bellow feat: 423 enable on demand render mode usage #436 (comment))
• ❓ Positional Audio (@andretchen0 Should?)

Staging

• Smoke
• Precipitation
• Stars
• Environment/useEnvironment
• Backdrop (Doesnt need it)
• 🚫 Contact Shadow (broken component)
• Sky
• 🚫 Sparkles (broken component)
• Ocean
• ⚠️ Fit (see bellow feat: 423 enable on demand render mode usage #436 (comment))

Materials

• WobbleMaterial
• GlassMaterial (Doesnt need it)
• HolographicMaterial
• ReflectionMaterial
• CustomShaderMaterial

Loaders

• SVG (Doesnt need it)
• useGLTF (Doesnt need it)
• useVideoTexture (Doesnt need it)

Shapes

• CatmullRomCurve3 (Doesnt need it)
• Line2 (Doesnt need it)
• Superformula (Doesnt need it)
• RoundedBox (Doesnt need it)

Misc

• HTML (Doesnt need it)
• Stats/StagsGI (Doesnt need it)
• BakeShadows (Doesnt need it)
• GLTFExporter

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[alvarosabu]

Hey @andretchen0 something weird happened with some demos when I tried to test and implement on-demand invalidation. For some reason render-mode="on-demand" doesn't seem to do anything on this demo. But I can't find anything on the respective components that could be automatically invalidating the scene 😵‍💫

render-mode="manual" does work as expected.

Demos:

• Lensflare
• AnimatedSprites
• Fit

[andretchen0]

Hey @alvarosabu ,

Looking at the code, there are 2 cases:

Invalidated by the demo

• In LensflareDemo, on-demand is invalidated by setting props in the demo: <TresPointLight :position="[x, 0, z]">
• This is also the case in FitDemo: <TresGroup :rotation="[rx0, ry0, rz0]" :position="[x0, y0, z0]" :scale="[sx0, sy0, sz0]">

Invalidated by the component

• For AnimatedSprite, the component itself will typically set several props when the shown frame changes, causing invalidation in on-render, e.g.: <TresSprite :scale="[scaleX, scaleY, 1]" :position="[positionX, positionY, 0]" >

How can I help?

• What would a solution look like here?
• Would you like me to code it up and push here?

[alvarosabu]

Hey @alvarosabu ,

Looking at the code, there are 2 cases:

Invalidated by the demo

• In LensflareDemo, on-demand is invalidated by setting props in the demo: <TresPointLight :position="[x, 0, z]">
• This is also the case in FitDemo: <TresGroup :rotation="[rx0, ry0, rz0]" :position="[x0, y0, z0]" :scale="[sx0, sy0, sz0]">

Invalidated by the component

• For AnimatedSprite, the component itself will typically set several props when the shown frame changes, causing invalidation in on-render, e.g.: <TresSprite :scale="[scaleX, scaleY, 1]" :position="[positionX, positionY, 0]" >

How can I help?

• What would a solution look like here?
• Would you like me to code it up and push here?

Ohhhh ok I wanted to confirm if it was invalidated due to the prop changes, you are right. That would mean that potentially we don't need to add anything extra for the AnimatedSprite since the invalidation happens internally.

I will try to remove the elements on the demo that invalidate (without committing changes) so I can test the internal invalidation for the other two 👍