j-templates 7.0.69 → 7.0.71

package/DOM/domNodeConfig.js

@@ -169,9 +169,10 @@ exports.DOMNodeConfig = {
             target.appendChild(children[x]);
     },
     reconcileChild(target, child) {
-        if (target.childElementCount === 0)
-            target.appendChild(child);
-        else if (target.childElementCount > 1 || target.firstChild !== child)
-            target.replaceChildren(child);
+        if (target.firstChild === child)
+            return;
+        target.appendChild(child);
+        while (target.firstChild !== child)
+            target.removeChild(target.firstChild);
     },
 };

package/Node/component.d.ts

@@ -38,14 +38,6 @@ export declare class Component<D = void, T = void, E = {}> {
      * Accessor for the component's template collection.
      */
     protected get Templates(): T;
-    /**
-     * Creates a new Component instance. Not intended to be overriden.
-     *
-     * @param data - Initial data or a factory function returning data/promise.
-     * @param templates - Template definitions for rendering.
-     * @param vNode - The underlying virtual node instance.
-     * @param componentEvents - Optional event callbacks.
-     */
     constructor(vNode: vNodeType, config: vComponentConfig<D, E>, templates: T);
     /**
      * Returns the component's rendered vNode(s).

package/Node/component.js

@@ -48,32 +48,9 @@ class Component {
     get Templates() {
         return this.templates;
     }
-    /**
-     * Creates a new Component instance. Not intended to be overriden.
-     *
-     * @param data - Initial data or a factory function returning data/promise.
-     * @param templates - Template definitions for rendering.
-     * @param vNode - The underlying virtual node instance.
-     * @param componentEvents - Optional event callbacks.
-     */
-    /* constructor(
-      data: D | (() => D | Promise<D>),
-      templates: T,
-      private vNode: vNodeType,
-      private componentEvents: ComponentEvents<E>,
-    ) {
-      if (typeof data === "function")
-        this.scope = new ObservableScope<D>(data as () => D | Promise<D>);
-      else this.scope = new ObservableScope<D>(() => data);
-  
-      this.templates = templates || ({} as T);
-    } */
     constructor(vNode, config, templates) {
         this.vNode = vNode;
         const { data, on } = config;
-        /* if (typeof data === "function")
-          this.scope = new ObservableScope<D>(data as () => D | Promise<D>);
-        else this.scope = new ObservableScope<D>(() => data); */
         if (typeof data === "function")
             this.scope = Store_1.ObservableScope.Create(data);
         else
@@ -119,30 +96,13 @@ class Component {
     }
 }
 exports.Component = Component;
-/* type ComponentConstructor<D, T, E> = {
-  new (
-    data: D | (() => D | Promise<D>),
-    templates: T,
-    vNode: vNodeType,
-    componentEvents: ComponentEvents<E>,
-  ): Component<D, T, E>;
-}; */
 (function (Component) {
     /**
      * Function wraps the Component as a function that can be used to create vNode objects
      * and generate templates.
      */
-    function ToFunction(type, 
-    // constructor: ComponentConstructor<D, T, E>,
-    constructor, namespace) {
+    function ToFunction(type, constructor, namespace) {
         return function (config, templates) {
-            /* const { data, on, props } = config;
-      
-            class ConcreteComponent extends constructor {
-              constructor(vnode: vNodeType) {
-                super(data, templates, vnode, on);
-              }
-            } */
             function ComponentFactory(vnode) {
                 return new constructor(vnode, config, templates);
             }
@@ -151,7 +111,6 @@ exports.Component = Component;
                 namespace: namespace ?? null,
                 props: config.props,
                 componentFactory: ComponentFactory,
-                // componentConstructor: ConcreteComponent,
             };
             return vNode_1.vNode.Create(definition);
         };

package/Node/vNode.js

@@ -14,7 +14,6 @@ var vNode;
         return {
             definition,
             type: definition.type,
-            // injector: definition.componentConstructor
             injector: definition.componentFactory
                 ? injector_1.Injector.Scope(injector_1.Injector.Current(), function () {
                     return new injector_1.Injector();
@@ -95,9 +94,7 @@ var vNode;
     vNode.Attach = Attach;
 })(vNode || (exports.vNode = vNode = {}));
 function InitNode(vnode) {
-    const { type, namespace, props, attrs, on, data, 
-    // componentConstructor,
-    componentFactory, children, childrenArray, } = vnode.definition;
+    const { type, namespace, props, attrs, on, data, componentFactory, children, childrenArray, } = vnode.definition;
     const node = (vnode.node =
         vnode.definition.node ?? nodeConfig_1.NodeConfig.createNode(type, namespace));
     vnode.definition = null;
@@ -105,11 +102,8 @@ function InitNode(vnode) {
         const assignProperties = nodeConfig_1.NodeConfig.createPropertyAssignment(node);
         if (typeof props === "function") {
             const scope = Store_1.ObservableScope.Create(props);
-            // const [value, scope] = ObservableScope.CreateIf(props as () => any);
-            // if (scope) {
             vnode.scopes.push(scope);
             Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignProperties));
-            // }
             assignProperties(Store_1.ObservableScope.Value(scope));
         }
         else
@@ -119,11 +113,8 @@ function InitNode(vnode) {
         const assignEvents = nodeConfig_1.NodeConfig.createEventAssignment(node);
         if (typeof on === "function") {
             const scope = Store_1.ObservableScope.Create(on);
-            // const [value, scope] = ObservableScope.CreateIf(on);
-            // if (scope) {
             vnode.scopes.push(scope);
             Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignEvents));
-            // }
             assignEvents(Store_1.ObservableScope.Value(scope));
         }
         else
@@ -133,19 +124,14 @@ function InitNode(vnode) {
         const assignAttributes = nodeConfig_1.NodeConfig.createAttributeAssignment(node);
         if (typeof attrs === "function") {
             const scope = Store_1.ObservableScope.Create(attrs);
-            // const [value, scope] = ObservableScope.CreateIf(attrs);
-            // if (scope) {
             vnode.scopes.push(scope);
             Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignAttributes));
-            //}
             assignAttributes(Store_1.ObservableScope.Value(scope));
         }
         else
             assignAttributes(attrs);
     }
-    // if (componentConstructor) {
     if (componentFactory) {
-        // vnode.component = new componentConstructor(vnode);
         vnode.component = componentFactory(vnode);
         vnode.component.Bound();
         function componentChildren() {
@@ -171,7 +157,6 @@ function Children(vnode, children, data) {
                 return;
             const startChildren = vnode.children;
             const newChildren = Store_1.ObservableScope.Value(scope);
-            // AssignChildren(vnode, scope);
             if (startChildren !== newChildren) {
                 vnode.children = newChildren;
                 UpdateChildren(vnode);
@@ -179,21 +164,7 @@ function Children(vnode, children, data) {
         }));
     }
     vnode.children = Store_1.ObservableScope.Value(childrenScope);
-    // AssignChildren(vnode, childrenScope);
 }
-/* function AssignChildren(
-  vnode: vNodeType,
-  childrenScope: IObservableScope<
-    [
-      any,
-      vNodeType[],
-      IObservableScope<string | vNodeType | vNodeType[]> | null,
-    ][]
-  >,
-) {
-  const children = ObservableScope.Peek(childrenScope);
-  vnode.children = children;
-} */
 const DEFAULT_DATA = [undefined];
 function DefaultData() {
     return DEFAULT_DATA;
@@ -302,7 +273,6 @@ function EvaluateNextNodesLarge(injector, getNextChildren, nextData, nodeArray)
         if (currentChildIndex !== -1) {
             const currentChild = currentChildren[currentChildIndex];
             currentChildren[currentChildIndex] = null;
-            // if (currentChild[2]) {
             const scope = currentChild[2];
             const value = scope.value;
             const updatedValue = Store_1.ObservableScope.Value(scope);
@@ -310,13 +280,7 @@ function EvaluateNextNodesLarge(injector, getNextChildren, nextData, nodeArray)
                 vNode.DestroyAll(currentChild[1]);
                 currentChild[1] = CreateNodeArray(updatedValue);
             }
-            // }
-            /* if (currentChild[2]?.dirty) {
-              const nextChildren = ObservableScope.Value(currentChild[2]);
-              currentChild[1] = CreateNodeArray(nextChildren);
-              } */
             nextNodes[x] = currentChild;
-            // currentChildren[currentChildIndex] = null;
             if (currentChildIndex === 0)
                 dataMap.delete(data);
         }
@@ -324,9 +288,6 @@ function EvaluateNextNodesLarge(injector, getNextChildren, nextData, nodeArray)
             const scope = Store_1.ObservableScope.Create(function () {
                 return injector_1.Injector.Scope(injector, getNextChildren, data);
             });
-            /* const [nextChildren, scope] = ObservableScope.CreateIf(function () {
-              return Injector.Scope(injector, getNextChildren, data);
-              }); */
             nextNodes[x] = [
                 data,
                 CreateNodeArray(Store_1.ObservableScope.Value(scope)),
@@ -411,7 +372,6 @@ function ScheduledAssignment(assign) {
             return;
         scheduled = true;
         nodeConfig_1.NodeConfig.scheduleUpdate(function () {
-            // if (scope.destroyed) return;
             scheduled = false;
             const value = Store_1.ObservableScope.Peek(scope);
             assign(value);

package/Store/Tree/observableNode.d.ts

@@ -1,12 +1,56 @@
 import { JsonDiffResult } from "../../Utils/json";
-export declare const IS_OBSERVABLE_NODE = "____isObservableNode";
-export declare const GET_OBSERVABLE_VALUE = "____getObservableValue";
-export declare const GET_TO_JSON = "toJSON";
+/**
+ * Symbol to identify observable nodes.
+ * Used to check if a value is an observable node proxy.
+ */
+export declare const IS_OBSERVABLE_NODE: unique symbol;
+/**
+ * Symbol to get the raw underlying value from an observable node.
+ * Returns the unwrapped, non-proxied value.
+ */
+export declare const GET_OBSERVABLE_VALUE: unique symbol;
+/**
+ * Symbol for the toJSON method on observable nodes.
+ * Used to serialize observable nodes to plain JSON.
+ */
+export declare const GET_TO_JSON: unique symbol;
 export declare namespace ObservableNode {
-    function BypassProxy(value: boolean): void;
+    /**
+     * Unwraps an observable node to get the raw underlying value.
+     * Recursively unwraps nested objects and arrays.
+     * @template T The type of value to unwrap.
+     * @param value The value to unwrap, which may be an observable node or plain value.
+     * @returns The unwrapped raw value without proxy wrappers.
+     */
     function Unwrap<T>(value: T): T;
+    /**
+     * Creates an observable node from a plain value.
+     * Wraps the value in a proxy that tracks changes and enables reactive updates.
+     * @template T The type of value to wrap.
+     * @param value The plain value (object, array, or primitive) to make observable.
+     * @returns A proxied version of the value that emits change events.
+     */
     function Create<T>(value: T): T;
+    /**
+     * Marks an observable node or its property as changed, triggering reactive updates.
+     * Used internally to notify dependencies that a value has been modified.
+     * @param value The observable node to touch.
+     * @param prop Optional property name or index to touch a specific nested property.
+     */
     function Touch(value: unknown, prop?: string | number): void;
+    /**
+     * Applies a JSON diff result to an observable node, efficiently updating only changed properties.
+     * Optimizes nested object updates by computing paths incrementally and touching modified properties.
+     * @param rootNode The observable node to apply the diff to.
+     * @param diffResult The diff result from JsonDiff containing path-value pairs of changes.
+     */
     function ApplyDiff(rootNode: any, diffResult: JsonDiffResult): void;
+    /**
+     * Creates a factory function for making values observable with optional aliasing.
+     * The alias function transforms values before creating the observable proxy,
+     * useful for read-only views or value transformations.
+     * @param alias Optional function to transform values before making them observable.
+     * @returns A function that creates observable nodes from plain values.
+     */
     function CreateFactory(alias?: (value: any) => any | undefined): <T>(value: T) => T;
 }

package/Store/Tree/observableNode.js

@@ -4,10 +4,21 @@ exports.ObservableNode = exports.GET_TO_JSON = exports.GET_OBSERVABLE_VALUE = ex
 const json_1 = require("../../Utils/json");
 const jsonType_1 = require("../../Utils/jsonType");
 const observableScope_1 = require("./observableScope");
-let bypassProxy = false;
-exports.IS_OBSERVABLE_NODE = "____isObservableNode";
-exports.GET_OBSERVABLE_VALUE = "____getObservableValue";
-exports.GET_TO_JSON = "toJSON";
+/**
+ * Symbol to identify observable nodes.
+ * Used to check if a value is an observable node proxy.
+ */
+exports.IS_OBSERVABLE_NODE = Symbol("isObservableNode");
+/**
+ * Symbol to get the raw underlying value from an observable node.
+ * Returns the unwrapped, non-proxied value.
+ */
+exports.GET_OBSERVABLE_VALUE = Symbol("getObservableValue");
+/**
+ * Symbol for the toJSON method on observable nodes.
+ * Used to serialize observable nodes to plain JSON.
+ */
+exports.GET_TO_JSON = Symbol("toJSON");
 const proxyCache = new WeakMap();
 const scopeCache = new WeakMap();
 const leafScopeCache = new WeakMap();
@@ -40,7 +51,7 @@ function ownKeysArray(value) {
 function UnwrapProxy(value, type = (0, jsonType_1.JsonType)(value)) {
     if (type === "value")
         return value;
-    if (value[exports.IS_OBSERVABLE_NODE] === true)
+    if (value[exports.IS_OBSERVABLE_NODE])
         return value[exports.GET_OBSERVABLE_VALUE];
     switch (type) {
         case "object": {
@@ -114,8 +125,6 @@ function CreateProxyFactory(alias) {
     function ArrayProxySetter(array, prop, value) {
         if (readOnly)
             throw `Object is readonly`;
-        if (prop === exports.IS_OBSERVABLE_NODE)
-            throw `Cannot assign read-only property: ${exports.IS_OBSERVABLE_NODE}`;
         value = UnwrapProxy(value);
         array[prop] = value;
         const scope = scopeCache.get(array);
@@ -147,8 +156,6 @@ function CreateProxyFactory(alias) {
                 const scope = scopeCache.get(array);
                 array = observableScope_1.ObservableScope.Value(scope);
                 const arrayValue = array[prop];
-                if (bypassProxy)
-                    return arrayValue;
                 if (typeof prop === "symbol")
                     return arrayValue;
                 if (typeof arrayValue === "function")
@@ -188,8 +195,6 @@ function CreateProxyFactory(alias) {
     function ObjectProxySetter(object, prop, value) {
         if (readOnly)
             throw `Object is readonly`;
-        if (prop === exports.IS_OBSERVABLE_NODE)
-            throw `Cannot assign read-only property: ${exports.IS_OBSERVABLE_NODE}`;
         const jsonType = (0, jsonType_1.JsonType)(value);
         if (jsonType === "value") {
             value !== object[prop] && SetPropertyValue(object, prop, value);
@@ -224,8 +229,6 @@ function CreateProxyFactory(alias) {
             case exports.GET_OBSERVABLE_VALUE:
                 return object;
             default: {
-                if (bypassProxy)
-                    return object[prop];
                 return GetAccessorValue(object, prop);
             }
         }
@@ -264,18 +267,34 @@ function CreateProxyFactory(alias) {
 const DefaultCreateProxy = CreateProxyFactory();
 var ObservableNode;
 (function (ObservableNode) {
-    function BypassProxy(value) {
-        bypassProxy = value;
-    }
-    ObservableNode.BypassProxy = BypassProxy;
+    /**
+     * Unwraps an observable node to get the raw underlying value.
+     * Recursively unwraps nested objects and arrays.
+     * @template T The type of value to unwrap.
+     * @param value The value to unwrap, which may be an observable node or plain value.
+     * @returns The unwrapped raw value without proxy wrappers.
+     */
     function Unwrap(value) {
         return UnwrapProxy(value);
     }
     ObservableNode.Unwrap = Unwrap;
+    /**
+     * Creates an observable node from a plain value.
+     * Wraps the value in a proxy that tracks changes and enables reactive updates.
+     * @template T The type of value to wrap.
+     * @param value The plain value (object, array, or primitive) to make observable.
+     * @returns A proxied version of the value that emits change events.
+     */
     function Create(value) {
         return DefaultCreateProxy(value);
     }
     ObservableNode.Create = Create;
+    /**
+     * Marks an observable node or its property as changed, triggering reactive updates.
+     * Used internally to notify dependencies that a value has been modified.
+     * @param value The observable node to touch.
+     * @param prop Optional property name or index to touch a specific nested property.
+     */
     function Touch(value, prop) {
         let scope;
         if (prop !== undefined) {
@@ -286,6 +305,12 @@ var ObservableNode;
         observableScope_1.ObservableScope.Update(scope);
     }
     ObservableNode.Touch = Touch;
+    /**
+     * Applies a JSON diff result to an observable node, efficiently updating only changed properties.
+     * Optimizes nested object updates by computing paths incrementally and touching modified properties.
+     * @param rootNode The observable node to apply the diff to.
+     * @param diffResult The diff result from JsonDiff containing path-value pairs of changes.
+     */
     function ApplyDiff(rootNode, diffResult) {
         const root = rootNode[exports.GET_OBSERVABLE_VALUE];
         const pathTuples = [["", root]];
@@ -312,6 +337,13 @@ var ObservableNode;
         }
     }
     ObservableNode.ApplyDiff = ApplyDiff;
+    /**
+     * Creates a factory function for making values observable with optional aliasing.
+     * The alias function transforms values before creating the observable proxy,
+     * useful for read-only views or value transformations.
+     * @param alias Optional function to transform values before making them observable.
+     * @returns A function that creates observable nodes from plain values.
+     */
     function CreateFactory(alias) {
         return CreateProxyFactory(alias);
     }

package/Store/Tree/observableScope.js

@@ -5,6 +5,7 @@ exports.CalcScope = CalcScope;
 const array_1 = require("../../Utils/array");
 const emitter_1 = require("../../Utils/emitter");
 const functions_1 = require("../../Utils/functions");
+const list_1 = require("../../Utils/list");
 /**
  * Creates a dynamic (reactive) observable scope.
  * @template T The type of value stored in the scope.
@@ -47,6 +48,10 @@ function CreateStaticScope(initialValue) {
     };
 }
 let scopeQueue = [];
+/**
+ * Processes all queued scopes, recomputing dirty scopes and emitting changes.
+ * Executed as a microtask to batch updates efficiently.
+ */
 function ProcessScopeQueue() {
     const queue = scopeQueue;
     scopeQueue = [];
@@ -60,6 +65,11 @@ function ProcessScopeQueue() {
         }
     }
 }
+/**
+ * Queues a scope for batched update processing.
+ * Schedules ProcessScopeQueue as a microtask if the queue was empty.
+ * @param scope The scope to queue for update.
+ */
 function OnSetQueued(scope) {
     if (scopeQueue.length === 0)
         queueMicrotask(ProcessScopeQueue);
@@ -84,43 +94,93 @@ function OnSet(scope) {
     return false;
 }
 /**
- * Registers an emitter as a dependency for the current watch context.
- * Tracks which emitters are accessed during a scope's execution.
- * @param emitter The emitter to register as a dependency.
+ * Registers an emitter using SAME_STRATEGY.
+ * If the emitter is already registered at the current index, increments the index.
+ * Otherwise, switches to PUSH_STRATEGY and appends the emitter.
+ * @param state The current watch state.
+ * @param emitter The emitter to register.
  */
-function RegisterEmitter(emitter) {
-    if (watchState === null)
-        return;
-    if (watchState.emitterIndex !== null &&
-        watchState.emitters[watchState.emitterIndex] === emitter) {
-        watchState.emitterIndex++;
+function RegisterSame(state, emitter) {
+    if (state.emitterIndex < state.emitters.length &&
+        state.emitters[state.emitterIndex] === emitter) {
+        state.emitterIndex++;
         return;
     }
-    else if (watchState.emitterIndex !== null) {
-        const index = watchState.emitterIndex;
-        watchState.emitterIndex = null;
-        watchState.emitters = watchState.emitters.slice(0, index);
-    }
-    if (watchState.emitterIds) {
-        if (!watchState.emitterIds.has(emitter[0])) {
-            watchState.emitters.push(emitter);
-            watchState.emitterIds.add(emitter[0]);
-        }
-        return;
+    state.emitters = state.emitters.slice(0, state.emitterIndex);
+    state.strategy = SORTED_STRATEGY;
+    RegisterSorted(state, emitter);
+}
+/**
+ * Registers an emitter while maintaining sorted order by emitter ID.
+ * If insertion would break sort order, falls back to PUSH_STRATEGY.
+ * @param state The current watch state.
+ * @param emitter The emitter to register.
+ */
+function RegisterSorted(state, emitter) {
+    if (state.emitters.length === 0 ||
+        state.emitters[state.emitters.length - 1][0] < emitter[0])
+        state.emitters.push(emitter);
+    else {
+        state.strategy = PUSH_STRATEGY;
+        RegisterPush(state, emitter);
     }
-    watchState.emitters.push(emitter);
-    if (watchState.emitters.length > 50) {
-        const idSet = (watchState.emitterIds = new Set());
+}
+/**
+ * Registers an emitter using PUSH_STRATEGY.
+ * Switches to DISTINCT_STRATEGY when the emitter count exceeds 50 to optimize memory.
+ * @param state The current watch state.
+ * @param emitter The emitter to register.
+ */
+function RegisterPush(state, emitter) {
+    state.emitters.push(emitter);
+    if (state.emitters.length > 50) {
+        const idSet = (state.emitterIds = new Set([state.emitters[0][0]]));
         let writePos = 0;
-        for (let x = 1; x < watchState.emitters.length; x++) {
-            if (!idSet.has(watchState.emitters[x][0])) {
-                watchState.emitters[++writePos] = watchState.emitters[x];
-                idSet.add(watchState.emitters[x][0]);
+        for (let x = 1; x < state.emitters.length; x++) {
+            if (!idSet.has(state.emitters[x][0])) {
+                state.emitters[++writePos] = state.emitters[x];
+                idSet.add(state.emitters[x][0]);
             }
         }
         writePos++;
-        if (writePos < watchState.emitters.length)
-            watchState.emitters.splice(writePos);
+        if (writePos < state.emitters.length)
+            state.emitters.splice(writePos);
+        state.strategy = DISTINCT_STRATEGY;
+    }
+}
+/**
+ * Registers an emitter using DISTINCT_STRATEGY.
+ * Only adds emitters that haven't been registered yet, using an ID set for O(1) lookup.
+ * @param state The current watch state.
+ * @param emitter The emitter to register.
+ */
+function RegisterDistinct(state, emitter) {
+    if (!state.emitterIds.has(emitter[0])) {
+        state.emitters.push(emitter);
+        state.emitterIds.add(emitter[0]);
+    }
+}
+/**
+ * Routes an emitter to the appropriate registration strategy based on current watch state.
+ * Does nothing if not within a watch context.
+ * @param emitter The emitter to register.
+ */
+function RegisterEmitter(emitter) {
+    if (watchState === null)
+        return;
+    switch (watchState.strategy) {
+        case SAME_STRATEGY:
+            RegisterSame(watchState, emitter);
+            break;
+        case SORTED_STRATEGY:
+            RegisterSorted(watchState, emitter);
+            break;
+        case PUSH_STRATEGY:
+            RegisterPush(watchState, emitter);
+            break;
+        case DISTINCT_STRATEGY:
+            RegisterDistinct(watchState, emitter);
+            break;
     }
 }
 /**
@@ -144,7 +204,48 @@ function GetScopeValue(scope) {
     ExecuteScope(scope);
     return scope.value;
 }
+/**
+ * Strategy constants for optimizing emitter registration during watch operations.
+ * Each strategy represents a different approach to tracking and deduplicating dependencies.
+ */
+const SAME_STRATEGY = 1;
+const PUSH_STRATEGY = 2;
+const SORTED_STRATEGY = 3;
+const DISTINCT_STRATEGY = 4;
+const SHRINK_STRATEGY = 5;
 let watchState = null;
+const watchPool = list_1.List.Create();
+/**
+ * Creates a new watch state object, reusing from pool if available.
+ * Object pooling reduces GC pressure during frequent watch operations.
+ * @returns A new or recycled watch state object.
+ */
+function CreateWatchState() {
+    return (list_1.List.Pop(watchPool) ?? {
+        emitterIndex: 0,
+        value: null,
+        emitters: null,
+        emitterIds: null,
+        currentCalc: null,
+        nextCalc: null,
+        strategy: PUSH_STRATEGY,
+    });
+}
+/**
+ * Returns a watch state object to the pool for reuse.
+ * Resets all fields to their default values before pooling.
+ * @param state The watch state to return to the pool.
+ */
+function ReturnWatchState(state) {
+    state.emitterIndex = 0;
+    state.value = null;
+    state.emitters = null;
+    state.emitterIds = null;
+    state.currentCalc = null;
+    state.nextCalc = null;
+    state.strategy = SORTED_STRATEGY;
+    list_1.List.Push(watchPool, state);
+}
 /**
  * Executes a callback while tracking all scope and emitter dependencies.
  * Creates a watch context that records what was accessed during execution.
@@ -152,22 +253,21 @@ let watchState = null;
  * @param currentCalc Optional map of existing calc scopes to reuse.
  * @returns The watch state containing tracked dependencies and result.
  */
-function WatchFunction(callback, currentCalc = null, initialEmitters = []) {
+function WatchFunction(callback, currentCalc, initialEmitters) {
     const parent = watchState;
-    watchState = {
-        emitterIndex: initialEmitters.length > 0 ? 0 : null,
-        value: null,
-        emitters: initialEmitters,
-        emitterIds: null,
-        currentCalc: currentCalc,
-        nextCalc: null,
-    };
+    watchState = CreateWatchState();
+    watchState.emitters = initialEmitters ?? [];
+    watchState.currentCalc = currentCalc;
+    if (initialEmitters !== null)
+        watchState.strategy = SAME_STRATEGY;
     watchState.value = callback();
     const resultState = watchState;
     watchState = parent;
-    if (resultState.emitterIndex !== null &&
-        resultState.emitterIndex < resultState.emitters.length)
+    if (resultState.strategy === SAME_STRATEGY &&
+        resultState.emitterIndex < resultState.emitters.length) {
         resultState.emitters = resultState.emitters.slice(0, resultState.emitterIndex);
+        resultState.strategy = SHRINK_STRATEGY;
+    }
     return resultState;
 }
 /**
@@ -178,8 +278,7 @@ function WatchFunction(callback, currentCalc = null, initialEmitters = []) {
 function ExecuteScope(scope) {
     scope.dirty = false;
     const state = WatchFunction(scope.getFunction, scope.calcScopes, scope.emitters);
-    if (state.emitters !== scope.emitters)
-        UpdateEmitters(scope, state.emitters, !!state.emitterIds);
+    UpdateEmitters(scope, state.emitters, state.strategy);
     const calcScopes = state.currentCalc;
     scope.calcScopes = state.nextCalc;
     for (const key in calcScopes)
@@ -191,6 +290,7 @@ function ExecuteScope(scope) {
         });
     else
         scope.value = state.value;
+    ReturnWatchState(state);
 }
 /**
  * Creates a scope from a function, choosing between static and dynamic based on dependencies.
@@ -202,19 +302,22 @@ function ExecuteScope(scope) {
  */
 function ExecuteFunction(callback, greedy, allowStatic) {
     const async = (0, functions_1.IsAsync)(callback);
-    const state = WatchFunction(callback);
-    if (!allowStatic || async || state.emitters.length > 0) {
+    const state = WatchFunction(callback, null, null);
+    if (!allowStatic || async || state.emitters !== null) {
         const scope = CreateDynamicScope(callback, greedy, async ? null : state.value);
         scope.calcScopes = state.nextCalc;
-        UpdateEmitters(scope, state.emitters, !!state.emitterIds);
+        UpdateEmitters(scope, state.emitters, state.strategy);
         if (async)
             state.value.then(function (result) {
                 scope.value = result;
                 emitter_1.Emitter.Emit(scope.emitter, scope);
             });
+        ReturnWatchState(state);
         return scope;
     }
-    return CreateStaticScope(state.value);
+    const value = state.value;
+    ReturnWatchState(state);
+    return CreateStaticScope(value);
 }
 /**
  * Creates a computed scope that acts as a gatekeeper for parent scope emissions.
@@ -254,27 +357,32 @@ function CalcScope(callback, idOverride) {
  * @param right The new list of emitters to track.
  * @param distinct Whether emitters are already unique (sorted and deduplicated).
  */
-function UpdateEmitters(scope, right, distinct = false) {
-    distinct ? emitter_1.Emitter.Sort(right) : emitter_1.Emitter.Distinct(right);
-    if (scope.emitters === null) {
-        for (let x = 0; x < right.length; x++)
-            emitter_1.Emitter.On(right[x], scope.setCallback);
-        scope.emitters = right;
-        return;
-    }
-    if (right.length === 0) {
-        if (scope.emitters.length > 0) {
-            for (let x = 0; x < scope.emitters.length; x++)
+function UpdateEmitters(scope, right, strategy) {
+    switch (strategy) {
+        case SHRINK_STRATEGY: {
+            for (let x = right.length; x < scope.emitters.length; x++)
                 emitter_1.Emitter.Remove(scope.emitters[x], scope.setCallback);
-            scope.emitters = [];
+            break;
         }
-        return;
+        case PUSH_STRATEGY:
+        case DISTINCT_STRATEGY:
+            strategy === PUSH_STRATEGY
+                ? emitter_1.Emitter.Distinct(right)
+                : emitter_1.Emitter.Sort(right);
+        case SORTED_STRATEGY:
+            if (scope.emitters === null || scope.emitters.length === 0) {
+                for (let x = 0; x < right.length; x++)
+                    emitter_1.Emitter.On(right[x], scope.setCallback);
+            }
+            else {
+                (0, array_1.ReconcileSortedEmitters)(scope.emitters, right, function (emitter) {
+                    emitter_1.Emitter.On(emitter, scope.setCallback);
+                }, function (emitter) {
+                    emitter_1.Emitter.Remove(emitter, scope.setCallback);
+                });
+            }
+            break;
     }
-    (0, array_1.ReconcileSortedEmitters)(scope.emitters, right, function (emitter) {
-        emitter_1.Emitter.On(emitter, scope.setCallback);
-    }, function (emitter) {
-        emitter_1.Emitter.Remove(emitter, scope.setCallback);
-    });
     scope.emitters = right;
 }
 /**

package/Utils/decorators.js

@@ -20,9 +20,7 @@ exports.Scope = Scope;
 exports.Watch = Watch;
 exports.Inject = Inject;
 exports.Destroy = Destroy;
-// import { Component } from "../Node/component";
 const observableScope_1 = require("../Store/Tree/observableScope");
-// import { ElementNodeRefTypes } from "../Node/nodeRef.types";
 const observableNode_1 = require("../Store/Tree/observableNode");
 const Store_1 = require("../Store");
 /**
@@ -365,14 +363,6 @@ function WatchDecorator(target, propertyKey, descriptor, scopeFunction) {
         observableScope_1.ObservableScope.Watch(scope, function (scope) {
             instance[propertyKey](observableScope_1.ObservableScope.Value(scope));
         });
-        /* const [value, scope] = ObservableScope.CreateIf(scopeFunctionWrapper, true);
-        if (scope) {
-          const propertyMap = GetScopeMapForInstance(this);
-          propertyMap[propertyKey as string] = [scope, undefined];
-          ObservableScope.Watch(scope, function (scope) {
-            (instance as any)[propertyKey](ObservableScope.Value(scope));
-          });
-        } */
         instance[propertyKey](observableScope_1.ObservableScope.Value(scope));
         return instance;
     }

package/Utils/emitter.js

@@ -42,11 +42,6 @@ var Emitter;
     function Distinct(emitters) {
         if (emitters.length < 2)
             return;
-        // emitters.length < 51 ? DistinctSmall(emitters) : DistinctLarge(emitters);
-        DistinctSmall(emitters);
-    }
-    Emitter.Distinct = Distinct;
-    function DistinctSmall(emitters) {
         Sort(emitters);
         let writePos = 0;
         for (let x = 1; x < emitters.length; x++) {
@@ -58,20 +53,7 @@ var Emitter;
         if (writePos < emitters.length)
             emitters.splice(writePos);
     }
-    function DistinctLarge(emitters) {
-        let writePos = 0;
-        const ids = new Set();
-        for (let x = 0; x < emitters.length; x++) {
-            const id = emitters[x][0];
-            if (!ids.has(id)) {
-                ids.add(id);
-                emitters[writePos++] = emitters[x];
-            }
-        }
-        if (writePos < emitters.length)
-            emitters.splice(writePos);
-        Sort(emitters);
-    }
+    Emitter.Distinct = Distinct;
     function Sort(emitters) {
         if (emitters.length < 11)
             (0, array_1.InsertionSortTuples)(emitters);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "j-templates",
-  "version": "7.0.69",
+  "version": "7.0.71",
   "description": "j-templates",
   "license": "MIT",
   "repository": "https://github.com/TypesInCode/jTemplates",