fix(core): clean up rootStateMap

libs/core/src/lib/canvas.ts

@@ -29,6 +29,8 @@ import {
 import { coerceBooleanProperty } from './utils/coercion';
 import { createLoop } from './utils/loop';
 
+const rootStateMap = new Map<Element, () => NgtState>();
+
 @Component({
     selector: 'ngt-canvas',
     template: `
@@ -143,8 +145,6 @@ export class NgtCanvas extends NgtComponentStore implements OnInit {
     @ViewChild('rendererCanvas', { static: true })
     rendererCanvas!: ElementRef<HTMLCanvasElement>;
 
-    private readonly rootStateMap = new Map<Element, () => NgtState>();
-
     constructor(private zone: NgZone, private store: NgtStore) {
         super();
     }
@@ -161,14 +161,15 @@ export class NgtCanvas extends NgtComponentStore implements OnInit {
                     },
                 });
             }
-            this.rootStateMap.set(this.rendererCanvas.nativeElement, () =>
+            rootStateMap.set(this.rendererCanvas.nativeElement, () =>
                 this.store.get()
             );
-            const { invalidate, advance } = createLoop(this.rootStateMap);
+            const { invalidate, advance } = createLoop(rootStateMap);
 
             // init canvas
             this.store.init(
                 this.rendererCanvas.nativeElement,
+                rootStateMap,
                 invalidate,
                 advance
             );
@@ -185,13 +186,6 @@ export class NgtCanvas extends NgtComponentStore implements OnInit {
             });
         });
     }
-
-    override ngOnDestroy() {
-        this.zone.runOutsideAngular(() => {
-            this.rootStateMap.delete(this.rendererCanvas.nativeElement);
-        });
-        super.ngOnDestroy();
-    }
 }
 
 @NgModule({

libs/core/src/lib/services/loader.ts

@@ -24,7 +24,7 @@ import { is } from '../utils/is';
 
 @Injectable({ providedIn: 'root' })
 export class NgtLoader implements OnDestroy {
-    private readonly cached = new Map<string, BranchingReturn>();
+    private readonly cached = new Map();
 
     use<TReturnType, TUrl extends string | string[]>(
         loaderConstructor: new () => NgtLoaderResult<TReturnType>,

libs/core/src/lib/stores/store.ts

@@ -233,6 +233,7 @@ export class NgtStore extends NgtComponentStore<NgtState> {
 
     init(
         canvasElement: HTMLCanvasElement,
+        rootStateMap: Map<Element, () => NgtState>,
         invalidate: (state?: () => NgtState) => void,
         advance: (
             timestamp: number,
@@ -244,7 +245,7 @@ export class NgtStore extends NgtComponentStore<NgtState> {
         this.initEvents(canvasElement);
         this.resize(this.resizeResult$);
         this.updateDimensions(this.dimensions$);
-        this.initRenderer({ canvasElement, advance });
+        this.initRenderer({ canvasElement, rootStateMap, advance });
         this.updateSubscribers(
             this.select(
                 this.select((s) => s.internal.animations),
@@ -321,14 +322,15 @@ export class NgtStore extends NgtComponentStore<NgtState> {
 
     private readonly initRenderer = this.effect<{
         canvasElement: HTMLCanvasElement;
+        rootStateMap: Map<Element, () => NgtState>;
         advance: (
             timestamp: number,
             runGlobalCallbacks?: boolean,
             state?: () => NgtState,
             frame?: THREE.XRFrame
         ) => void;
     }>(
-        tapEffect(({ canvasElement, advance }) => {
+        tapEffect(({ canvasElement, rootStateMap, advance }) => {
             const state = this.get();
 
             // Scene
@@ -520,6 +522,8 @@ export class NgtStore extends NgtComponentStore<NgtState> {
                         ...state,
                         internal: { ...state.internal, active: false },
                     }));
+
+                    rootStateMap.delete(canvasElement);
                 }
             };
         })
@@ -596,9 +600,10 @@ export class NgtStore extends NgtComponentStore<NgtState> {
                     this.set((state) => ({
                         internal: {
                             ...state.internal,
-                            animations: new Map<string, NgtBeforeRenderRecord>(
-                                state.internal.animations
-                            ).set(uuid, record),
+                            animations: new Map(state.internal.animations).set(
+                                uuid,
+                                record
+                            ),
                             priority:
                                 state.internal.priority +
                                 ((record.priority || 0) > 0 ? 1 : 0),