chore: tell dont ask fix

playground/src/pages/rendering-modes/index.vue

@@ -13,7 +13,7 @@ setTimeout(() => {
 <template>
   <TresCanvas
     :clear-color="clearColor"
-    render-mode="manual"
+    render-mode="on-demand"
     @render="() => console.log('onRender')"
   >
     <Scene />

playground/src/pages/rendering-modes/scene.vue

@@ -5,7 +5,7 @@ import { OrbitControls } from '@tresjs/cientos'
 const { invalidate, advance } = useTres()
 
 function onControlChange() {
-  advance()
+  invalidate()
 }
 
 const positionX = ref(0)

src/composables/useTresContextProvider/index.ts

@@ -45,6 +45,7 @@ export interface TresContext {
    * If set to 'always', the scene will be rendered every frame
    */
   renderMode: Ref<'always' | 'on-demand' | 'manual'>
+  canBeInvalidated: ComputedRef<boolean>
   internal: InternalState
   /**
    * Invalidates the current frame when renderMode === 'on-demand'
@@ -147,6 +148,8 @@ export function useTresContextProvider({
       disableRender,
     })
 
+  const renderMode = ref<'always' | 'on-demand' | 'manual'>(rendererOptions.renderMode || 'always')
+
   const toProvide: TresContext = {
     sizes,
     scene: localScene,
@@ -167,7 +170,8 @@ export function useTresContextProvider({
         accumulator: [],
       },
     },
-    renderMode: ref(rendererOptions.renderMode || 'always'),
+    renderMode,
+    canBeInvalidated: computed(() => renderMode.value === 'on-demand' && internal.frames.value === 0),
     internal,
     advance,
     extend,

src/core/nodeOps.ts

@@ -28,7 +28,7 @@ export function invalidateInstance(instance: TresObject) {
   
   if (!ctx) return
   
-  if (ctx.renderMode.value === 'on-demand' && ctx.internal.frames.value === 0) {
+  if (ctx.canBeInvalidated.value) {
     ctx.invalidate()
   }