@lynx-js/react 0.109.2 → 0.110.1

package/runtime/lib/lifecycle/ref/delay.d.ts

@@ -0,0 +1,31 @@
+import type { NodesRef } from '@lynx-js/types';
+/**
+ * A flag to indicate whether UI operations should be delayed.
+ * When set to true, UI operations will be queued in the `delayedUiOps` array
+ * and executed later when `runDelayedUiOps` is called.
+ * This is used before hydration to ensure UI operations are batched
+ * and executed at the appropriate time.
+ */
+declare const shouldDelayUiOps: {
+    value: boolean;
+};
+/**
+ * Executes all delayed UI operations.
+ */
+declare function runDelayedUiOps(): void;
+/**
+ * A proxy class designed for managing and executing reference-based tasks.
+ * It delays the execution of tasks until hydration is complete.
+ */
+declare class RefProxy {
+    private readonly refAttr;
+    private task;
+    constructor(refAttr: [snapshotInstanceId: number, expIndex: number]);
+    private setTask;
+    invoke(...args: Parameters<NodesRef['invoke']>): RefProxy;
+    path(...args: Parameters<NodesRef['path']>): RefProxy;
+    fields(...args: Parameters<NodesRef['fields']>): RefProxy;
+    setNativeProps(...args: Parameters<NodesRef['setNativeProps']>): RefProxy;
+    exec(): void;
+}
+export {};

package/runtime/lib/lifecycle/ref/delay.js

@@ -0,0 +1,80 @@
+// Copyright 2024 The Lynx Authors. All rights reserved.
+// Licensed under the Apache License Version 2.0 that can be found in the
+// LICENSE file in the root directory of this source tree.
+import { hydrationMap } from '../../snapshotInstanceHydrationMap.js';
+/**
+ * A flag to indicate whether UI operations should be delayed.
+ * When set to true, UI operations will be queued in the `delayedUiOps` array
+ * and executed later when `runDelayedUiOps` is called.
+ * This is used before hydration to ensure UI operations are batched
+ * and executed at the appropriate time.
+ */
+const shouldDelayUiOps = { value: true };
+/**
+ * An array of functions that will be executed later when `runDelayedUiOps` is called.
+ * These functions contain UI operations that need to be delayed.
+ */
+const delayedUiOps = [];
+/**
+ * Runs a task either immediately or delays it based on the `shouldDelayUiOps` flag.
+ * @param task - The function to execute.
+ */
+function runOrDelay(task) {
+    if (shouldDelayUiOps.value) {
+        delayedUiOps.push(task);
+    }
+    else {
+        task();
+    }
+}
+/**
+ * Executes all delayed UI operations.
+ */
+function runDelayedUiOps() {
+    for (const task of delayedUiOps) {
+        task();
+    }
+    shouldDelayUiOps.value = false;
+    delayedUiOps.length = 0;
+}
+/**
+ * A proxy class designed for managing and executing reference-based tasks.
+ * It delays the execution of tasks until hydration is complete.
+ */
+class RefProxy {
+    refAttr;
+    task;
+    constructor(refAttr) {
+        this.refAttr = refAttr;
+    }
+    setTask(method, args) {
+        this.task = (nodesRef) => {
+            return nodesRef[method](...args);
+        };
+        return this;
+    }
+    invoke(...args) {
+        return new RefProxy(this.refAttr).setTask('invoke', args);
+    }
+    path(...args) {
+        return new RefProxy(this.refAttr).setTask('path', args);
+    }
+    fields(...args) {
+        return new RefProxy(this.refAttr).setTask('fields', args);
+    }
+    setNativeProps(...args) {
+        return new RefProxy(this.refAttr).setTask('setNativeProps', args);
+    }
+    exec() {
+        runOrDelay(() => {
+            const realRefId = hydrationMap.get(this.refAttr[0]) ?? this.refAttr[0];
+            const refSelector = `[react-ref-${realRefId}-${this.refAttr[1]}]`;
+            this.task(lynx.createSelectorQuery().select(refSelector)).exec();
+        });
+    }
+}
+/**
+ * @internal
+ */
+export { RefProxy, runDelayedUiOps, shouldDelayUiOps };
+//# sourceMappingURL=delay.js.map

package/runtime/lib/lifecycle/ref/delay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"delay.js","sourceRoot":"","sources":["../../../src/lifecycle/ref/delay.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,yEAAyE;AACzE,0DAA0D;AAI1D,OAAO,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAC;AAIrE;;;;;;GAMG;AACH,MAAM,gBAAgB,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;AAEzC;;;GAGG;AACH,MAAM,YAAY,GAAmB,EAAE,CAAC;AAExC;;;GAGG;AACH,SAAS,UAAU,CAAC,IAAgB;IAClC,IAAI,gBAAgB,CAAC,KAAK,EAAE,CAAC;QAC3B,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;SAAM,CAAC;QACN,IAAI,EAAE,CAAC;IACT,CAAC;AACH,CAAC;AAED;;GAEG;AACH,SAAS,eAAe;IACtB,KAAK,MAAM,IAAI,IAAI,YAAY,EAAE,CAAC;QAChC,IAAI,EAAE,CAAC;IACT,CAAC;IACD,gBAAgB,CAAC,KAAK,GAAG,KAAK,CAAC;IAC/B,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;AAC1B,CAAC;AAED;;;GAGG;AACH,MAAM,QAAQ;IACK,OAAO,CAAiD;IACjE,IAAI,CAAsB;IAElC,YAAY,OAAuD;QACjE,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACzB,CAAC;IAEO,OAAO,CACb,MAAS,EACT,IAA6B;QAE7B,IAAI,CAAC,IAAI,GAAG,CAAC,QAAQ,EAAE,EAAE;YACvB,OAAQ,QAAQ,CAAC,MAAM,CAAkD,CAAC,GAAG,IAAI,CAAC,CAAC;QACrF,CAAC,CAAC;QACF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,CAAC,GAAG,IAAoC;QAC5C,OAAO,IAAI,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;IAC5D,CAAC;IAED,IAAI,CAAC,GAAG,IAAkC;QACxC,OAAO,IAAI,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAC1D,CAAC;IAED,MAAM,CAAC,GAAG,IAAoC;QAC5C,OAAO,IAAI,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;IAC5D,CAAC;IAED,cAAc,CAAC,GAAG,IAA4C;QAC5D,OAAO,IAAI,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,gBAAgB,EAAE,IAAI,CAAC,CAAC;IACpE,CAAC;IAED,IAAI;QACF,UAAU,CAAC,GAAG,EAAE;YACd,MAAM,SAAS,GAAG,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YACvE,MAAM,WAAW,GAAG,cAAc,SAAS,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC;YAClE,IAAI,CAAC,IAAK,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;QACpE,CAAC,CAAC,CAAC;IACL,CAAC;CACF;AAED;;GAEG;AACH,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,gBAAgB,EAAE,CAAC"}

package/runtime/lib/lifecycle/reload.d.ts

@@ -1,3 +1,3 @@
-declare function reloadMainThread(data: any, options: UpdatePageOption): void;
+declare function reloadMainThread(data: unknown, options: UpdatePageOption): void;
 declare function reloadBackground(updateData: Record<string, any>): void;
 export { reloadBackground, reloadMainThread };

package/runtime/lib/lifecycle/reload.js

@@ -8,18 +8,19 @@
 import { render } from 'preact';
 import { hydrate } from '../hydrate.js';
 import { LifecycleConstant } from '../lifecycleConstant.js';
-import { __pendingListUpdates } from '../list.js';
+import { __pendingListUpdates } from '../pendingListUpdates.js';
 import { __root, setRoot } from '../root.js';
+import { destroyBackground } from './destroy.js';
+import { applyRefQueue } from '../snapshot/workletRef.js';
 import { SnapshotInstance, __page, snapshotInstanceManager } from '../snapshot.js';
-import { takeGlobalRefPatchMap } from '../snapshot/ref.js';
 import { isEmptyObject } from '../utils.js';
 import { destroyWorklet } from '../worklet/destroy.js';
-import { destroyBackground } from './destroy.js';
 import { clearJSReadyEventIdSwap, isJSReady } from './event/jsReady.js';
 import { increaseReloadVersion } from './pass.js';
+import { setMainThreadHydrationFinished } from './patch/isMainThreadHydrationFinished.js';
 import { deinitGlobalSnapshotPatch } from './patch/snapshotPatch.js';
+import { shouldDelayUiOps } from './ref/delay.js';
 import { renderMainThread } from './render.js';
-import { setMainThreadHydrationFinished } from './patch/isMainThreadHydrationFinished.js';
 function reloadMainThread(data, options) {
     if (__PROFILE__) {
         console.profile('reloadTemplate');
@@ -42,12 +43,12 @@ function reloadMainThread(data, options) {
     });
     // always call this before `__FlushElementTree`
     __pendingListUpdates.flush();
+    applyRefQueue();
     if (isJSReady) {
         __OnLifecycleEvent([
             LifecycleConstant.firstScreen, /* FIRST_SCREEN */
             {
                 root: JSON.stringify(__root),
-                refPatch: JSON.stringify(takeGlobalRefPatchMap()),
             },
         ]);
     }
@@ -66,6 +67,8 @@ function reloadBackground(updateData) {
     increaseReloadVersion();
     // COW when modify `lynx.__initData` to make sure Provider & Consumer works
     lynx.__initData = Object.assign({}, lynx.__initData, updateData);
+    shouldDelayUiOps.value = true;
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
     render(__root.__jsx, __root);
     if (__PROFILE__) {
         console.profileEnd();

package/runtime/lib/lifecycle/reload.js.map

@@ -1 +1 @@
-{"version":3,"file":"reload.js","sourceRoot":"","sources":["../../src/lifecycle/reload.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"reload.js","sourceRoot":"","sources":["../../src/lifecycle/reload.ts"],"names":[],"mappings":"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"}

package/runtime/lib/lifecycle/render.js

@@ -12,6 +12,7 @@ function renderMainThread() {
     /* v8 ignore start */
     if (process.env['NODE_ENV'] === 'test' && typeof __TESTING_FORCE_RENDER_TO_OPCODE__ !== 'undefined'
         && !__TESTING_FORCE_RENDER_TO_OPCODE__) {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         render(__root.__jsx, __root);
     }
     else {
@@ -20,8 +21,7 @@ function renderMainThread() {
             if (__PROFILE__) {
                 console.profile('renderToString');
             }
-            // @ts-ignore
-            opcodes = renderToString(__root.__jsx);
+            opcodes = renderToString(__root.__jsx, undefined);
         }
         catch (e) {
             lynx.reportError(e);
@@ -35,6 +35,7 @@ function renderMainThread() {
         if (__PROFILE__) {
             console.profile('renderOpcodesInto');
         }
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         renderOpcodesInto(opcodes, __root);
         if (__ENABLE_SSR__) {
             __root.__opcodes = opcodes;

package/runtime/lib/lifecycle/render.js.map

@@ -1 +1 @@
-{"version":3,"file":"render.js","sourceRoot":"","sources":["../../src/lifecycle/render.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,yEAAyE;AACzE,0DAA0D;AAE1D;;GAEG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,6BAA6B,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEpC,SAAS,gBAAgB;IACvB,qBAAqB;IACrB,IACE,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,MAAM,IAAI,OAAO,kCAAkC,KAAK,WAAW;WAC5F,CAAC,kCAAkC,EACtC,CAAC;QACD,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,MAAa,CAAC,CAAC;IACtC,CAAC;SAAM,CAAC;QACN,IAAI,OAAO,CAAC;QACZ,IAAI,CAAC;YACH,IAAI,WAAW,EAAE,CAAC;gBAChB,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;YACpC,CAAC;YACD,aAAa;YACb,OAAO,GAAG,cAAc,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACzC,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,CAAU,CAAC,CAAC;YAC7B,OAAO,GAAG,EAAE,CAAC;QACf,CAAC;gBAAS,CAAC;YACT,IAAI,WAAW,EAAE,CAAC;gBAChB,OAAO,CAAC,UAAU,EAAE,CAAC;YACvB,CAAC;QACH,CAAC;QAED,IAAI,WAAW,EAAE,CAAC;YAChB,OAAO,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QACvC,CAAC;QACD,iBAAiB,CAAC,OAAO,EAAE,MAAa,CAAC,CAAC;QAC1C,IAAI,cAAc,EAAE,CAAC;YACnB,MAAM,CAAC,SAAS,GAAG,OAAO,CAAC;QAC7B,CAAC;QACD,IAAI,WAAW,EAAE,CAAC;YAChB,OAAO,CAAC,UAAU,EAAE,CAAC;QACvB,CAAC;IACH,CAAC;IACD,oBAAoB;AACtB,CAAC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"render.js","sourceRoot":"","sources":["../../src/lifecycle/render.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,yEAAyE;AACzE,0DAA0D;AAE1D;;GAEG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,6BAA6B,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEpC,SAAS,gBAAgB;IACvB,qBAAqB;IACrB,IACE,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,MAAM,IAAI,OAAO,kCAAkC,KAAK,WAAW;WAC5F,CAAC,kCAAkC,EACtC,CAAC;QACD,iEAAiE;QACjE,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,MAAa,CAAC,CAAC;IACtC,CAAC;SAAM,CAAC;QACN,IAAI,OAAO,CAAC;QACZ,IAAI,CAAC;YACH,IAAI,WAAW,EAAE,CAAC;gBAChB,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;YACpC,CAAC;YACD,OAAO,GAAG,cAAc,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QACpD,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,CAAU,CAAC,CAAC;YAC7B,OAAO,GAAG,EAAE,CAAC;QACf,CAAC;gBAAS,CAAC;YACT,IAAI,WAAW,EAAE,CAAC;gBAChB,OAAO,CAAC,UAAU,EAAE,CAAC;YACvB,CAAC;QACH,CAAC;QAED,IAAI,WAAW,EAAE,CAAC;YAChB,OAAO,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QACvC,CAAC;QACD,iEAAiE;QACjE,iBAAiB,CAAC,OAAO,EAAE,MAAa,CAAC,CAAC;QAC1C,IAAI,cAAc,EAAE,CAAC;YACnB,MAAM,CAAC,SAAS,GAAG,OAAO,CAAC;QAC7B,CAAC;QACD,IAAI,WAAW,EAAE,CAAC;YAChB,OAAO,CAAC,UAAU,EAAE,CAAC;QACvB,CAAC;IACH,CAAC;IACD,oBAAoB;AACtB,CAAC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/runtime/lib/lifecycleConstant.d.ts

@@ -1,10 +1,13 @@
-export declare class LifecycleConstant {
-    static readonly firstScreen = "rLynxFirstScreen";
-    static readonly updateFromRoot = "updateFromRoot";
-    static readonly globalEventFromLepus = "globalEventFromLepus";
-    static readonly ref = "rLynxRef";
-    static readonly jsReady = "rLynxJSReady";
-    static readonly patchUpdate = "rLynxChange";
+export declare const enum LifecycleConstant {
+    firstScreen = "rLynxFirstScreen",
+    updateFromRoot = "updateFromRoot",
+    globalEventFromLepus = "globalEventFromLepus",
+    jsReady = "rLynxJSReady",
+    patchUpdate = "rLynxChange"
+}
+export interface FirstScreenData {
+    root: string;
+    jsReadyEventIdSwap: Record<string | number, number>;
 }
 export declare const enum NativeUpdateDataType {
     UPDATE = 0,

package/runtime/lib/lifecycleConstant.js

@@ -1,14 +1,14 @@
 // Copyright 2024 The Lynx Authors. All rights reserved.
 // Licensed under the Apache License Version 2.0 that can be found in the
 // LICENSE file in the root directory of this source tree.
-export class LifecycleConstant {
-    static firstScreen = 'rLynxFirstScreen';
-    static updateFromRoot = 'updateFromRoot';
-    static globalEventFromLepus = 'globalEventFromLepus';
-    static ref = 'rLynxRef';
-    static jsReady = 'rLynxJSReady';
-    static patchUpdate = 'rLynxChange';
-}
+export var LifecycleConstant;
+(function (LifecycleConstant) {
+    LifecycleConstant["firstScreen"] = "rLynxFirstScreen";
+    LifecycleConstant["updateFromRoot"] = "updateFromRoot";
+    LifecycleConstant["globalEventFromLepus"] = "globalEventFromLepus";
+    LifecycleConstant["jsReady"] = "rLynxJSReady";
+    LifecycleConstant["patchUpdate"] = "rLynxChange";
+})(LifecycleConstant || (LifecycleConstant = {}));
 export var NativeUpdateDataType;
 (function (NativeUpdateDataType) {
     NativeUpdateDataType[NativeUpdateDataType["UPDATE"] = 0] = "UPDATE";

package/runtime/lib/lifecycleConstant.js.map

@@ -1 +1 @@
-{"version":3,"file":"lifecycleConstant.js","sourceRoot":"","sources":["../src/lifecycleConstant.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,yEAAyE;AACzE,0DAA0D;AAC1D,MAAM,OAAO,iBAAiB;IACrB,MAAM,CAAU,WAAW,GAAG,kBAAkB,CAAC;IACjD,MAAM,CAAU,cAAc,GAAG,gBAAgB,CAAC;IAClD,MAAM,CAAU,oBAAoB,GAAG,sBAAsB,CAAC;IAC9D,MAAM,CAAU,GAAG,GAAG,UAAU,CAAC;IACjC,MAAM,CAAU,OAAO,GAAG,cAAc,CAAC;IACzC,MAAM,CAAU,WAAW,GAAG,aAAa,CAAC;;AAGrD,MAAM,CAAN,IAAkB,oBAGjB;AAHD,WAAkB,oBAAoB;IACpC,mEAAU,CAAA;IACV,iEAAS,CAAA;AACX,CAAC,EAHiB,oBAAoB,KAApB,oBAAoB,QAGrC"}
+{"version":3,"file":"lifecycleConstant.js","sourceRoot":"","sources":["../src/lifecycleConstant.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,yEAAyE;AACzE,0DAA0D;AAC1D,MAAM,CAAN,IAAkB,iBAMjB;AAND,WAAkB,iBAAiB;IACjC,qDAAgC,CAAA;IAChC,sDAAiC,CAAA;IACjC,kEAA6C,CAAA;IAC7C,6CAAwB,CAAA;IACxB,gDAA2B,CAAA;AAC7B,CAAC,EANiB,iBAAiB,KAAjB,iBAAiB,QAMlC;AAOD,MAAM,CAAN,IAAkB,oBAGjB;AAHD,WAAkB,oBAAoB;IACpC,mEAAU,CAAA;IACV,iEAAS,CAAA;AACX,CAAC,EAHiB,oBAAoB,KAApB,oBAAoB,QAGrC"}

package/runtime/lib/list.d.ts

@@ -1,50 +1,6 @@
 import type { SnapshotInstance } from './snapshot.js';
-export interface ListUpdateInfo {
-    flush(): void;
-    onInsertBefore(newNode: SnapshotInstance, existingNode?: SnapshotInstance): void;
-    onRemoveChild(child: SnapshotInstance): void;
-    onSetAttribute(child: SnapshotInstance, attr: any, oldAttr: any): void;
-}
-interface InsertAction {
-    position: number;
-    type: string;
-}
-interface UpdateAction {
-    from: number;
-    to: number;
-    type: string;
-    flush: boolean;
-}
-interface ListOperations {
-    insertAction: InsertAction[];
-    removeAction: number[];
-    updateAction: UpdateAction[];
-}
-export declare class ListUpdateInfoRecording implements ListUpdateInfo {
-    private list;
-    constructor(list: SnapshotInstance);
-    flush(): void;
-    private oldChildNodes;
-    private removeChild;
-    private insertBefore;
-    private appendChild;
-    private platformInfoUpdate;
-    onInsertBefore(newNode: SnapshotInstance, existingNode?: SnapshotInstance): void;
-    onRemoveChild(child: SnapshotInstance): void;
-    onSetAttribute(child: SnapshotInstance, attr: any, _oldAttr: any): void;
-    private __toAttribute;
-    toJSON(): [ListOperations];
-}
-export declare const __pendingListUpdates: {
-    values: Record<number, ListUpdateInfo>;
-    clear(): void;
-    flush(): void;
-};
 export declare const gSignMap: Record<number, Map<number, SnapshotInstance>>;
 export declare const gRecycleMap: Record<number, Map<string, Map<number, SnapshotInstance>>>;
 export declare function clearListGlobal(): void;
-export declare function componentAtIndexFactory(ctx: SnapshotInstance[]): [ComponentAtIndexCallback, ComponentAtIndexesCallback];
+export declare function componentAtIndexFactory(ctx: SnapshotInstance[], hydrateFunction: (before: SnapshotInstance, after: SnapshotInstance) => void): [ComponentAtIndexCallback, ComponentAtIndexesCallback];
 export declare function enqueueComponentFactory(): EnqueueComponentCallback;
-export declare function snapshotCreateList(pageId: number, _ctx: SnapshotInstance, _expIndex: number): FiberElement;
-export declare function snapshotDestroyList(si: SnapshotInstance): void;
-export {};

package/runtime/lib/list.js

@@ -1,187 +1,10 @@
 // Copyright 2024 The Lynx Authors. All rights reserved.
 // Licensed under the Apache License Version 2.0 that can be found in the
 // LICENSE file in the root directory of this source tree.
-import { hydrate } from './hydrate.js';
-import { commitMainThreadPatchUpdate } from './lifecycle/patch/updateMainThread.js';
-// class ListUpdateInfoDiffing implements ListUpdateInfo {
-//   private oldChildNodes: SnapshotInstance[];
-//   constructor(private list: SnapshotInstance) {
-//     this.oldChildNodes = list.childNodes;
-//   }
-//   flush(): void {
-//     Object.defineProperty(SnapshotInstance.prototype, "key", {
-//       get: function () {
-//         return this.values[0]["item-key"];
-//       },
-//     });
-//   }
-//   onInsertBefore(newNode: SnapshotInstance, existingNode?: SnapshotInstance | undefined): void {}
-//   onRemoveChild(child: SnapshotInstance): void {}
-//   onSetAttribute(child: SnapshotInstance, attr: any): void {
-//     throw new Error("Method not implemented.");
-//   }
-// }
-export class ListUpdateInfoRecording {
-    list;
-    constructor(list) {
-        this.list = list;
-        this.oldChildNodes = list.childNodes;
-        // this.oldChildNodesSet = new Set(this.oldChildNodes);
-    }
-    // private __commitAndReset() {
-    //   (this.__pendingAttributes ??= []).push(this.__toAttribute());
-    //   this.oldChildNodes = this.list.childNodes;
-    //   this.oldChildNodesSet = new Set(this.oldChildNodes);
-    //   this.removeChild1.clear();
-    //   this.removeChild2.clear();
-    //   this.insertBefore.clear();
-    //   this.appendChild.length = 0;
-    //   this.platformInfoUpdate.clear();
-    // }
-    flush() {
-        const elementIndex = this.list.__snapshot_def.slot[0][1];
-        const listElement = this.list.__elements[elementIndex];
-        // this.__pendingAttributes?.forEach(pendingAttribute => {
-        //   __SetAttribute(listElement, "update-list-info", pendingAttribute);
-        //   __FlushElementTree(listElement);
-        // });
-        __SetAttribute(listElement, 'update-list-info', this.__toAttribute());
-        const [componentAtIndex, componentAtIndexes] = componentAtIndexFactory(this.list.childNodes);
-        __UpdateListCallbacks(listElement, componentAtIndex, enqueueComponentFactory(), componentAtIndexes);
-    }
-    oldChildNodes;
-    // private oldChildNodesSet: Set<SnapshotInstance>;
-    removeChild = new Set();
-    insertBefore = new Map(); // insert V before K
-    appendChild = [];
-    platformInfoUpdate = new Map();
-    onInsertBefore(newNode, existingNode) {
-        // @ts-ignore
-        if (newNode.__parent) {
-            // if (!this.oldChildNodesSet.has(newNode)) {
-            //   this.__commitAndReset();
-            // }
-            this.removeChild.add(newNode);
-        }
-        if (existingNode) {
-            // if (!this.oldChildNodesSet.has(existingNode)) {
-            //   this.__commitAndReset();
-            // }
-            const newChildren = this.insertBefore.get(existingNode) ?? [];
-            newChildren.push(newNode);
-            this.insertBefore.set(existingNode, newChildren);
-        }
-        else {
-            this.appendChild.push(newNode);
-        }
-    }
-    onRemoveChild(child) {
-        // if (!this.oldChildNodesSet.has(child)) {
-        //   this.__commitAndReset();
-        // }
-        this.removeChild.add(child);
-    }
-    onSetAttribute(child, attr, _oldAttr) {
-        this.platformInfoUpdate.set(child, attr);
-    }
-    __toAttribute() {
-        const { removeChild, insertBefore, appendChild, platformInfoUpdate } = this;
-        const removals = [];
-        const insertions = [];
-        const updates = [];
-        let j = 0;
-        for (let i = 0; i < this.oldChildNodes.length; i++, j++) {
-            const child = this.oldChildNodes[i];
-            if (platformInfoUpdate.has(child)) {
-                updates.push({
-                    ...platformInfoUpdate.get(child),
-                    from: +j,
-                    to: +j,
-                    // no flush
-                    flush: false,
-                    type: child.type,
-                });
-            }
-            if (insertBefore.has(child)) {
-                const children = insertBefore.get(child);
-                children.forEach(c => {
-                    insertions.push({
-                        position: j,
-                        type: c.type,
-                        ...c.__listItemPlatformInfo,
-                    });
-                    j++;
-                });
-            }
-            if (removeChild.has(child)) {
-                removals.push(i);
-                removeChild.delete(child);
-                j--;
-            }
-        }
-        for (let i = 0; i < appendChild.length; i++) {
-            const child = appendChild[i];
-            insertions.push({
-                position: j + i,
-                type: child.type,
-                ...child.__listItemPlatformInfo,
-            });
-        }
-        insertions.sort((a, b) => a.position - b.position);
-        removals.sort((a, b) => a - b);
-        if (SystemInfo.lynxSdkVersion === '2.14'
-            || SystemInfo.lynxSdkVersion === '2.15'
-            || SystemInfo.lynxSdkVersion === '2.16'
-            || SystemInfo.lynxSdkVersion === '2.17'
-            || SystemInfo.lynxSdkVersion === '2.18') {
-            const elementIndex = this.list.__snapshot_def.slot[0][1];
-            const listElement = this.list.__elements[elementIndex];
-            // `__GetAttributeByName` is available since Lynx 2.14
-            if (__GetAttributeByName(listElement, 'custom-list-name') === 'list-container') {
-                // `updateAction` must be full (not incremental) when Lynx version <= 2.18 and
-                // when `custom-list-name` is `list-container` (available when Lynx version >= 2.14) is true,
-                updates.length = 0;
-                this.list.childNodes.forEach((child, index) => {
-                    updates.push({
-                        ...child.__listItemPlatformInfo,
-                        from: index,
-                        to: index,
-                        // no flush
-                        flush: false,
-                        type: child.type,
-                    });
-                });
-            }
-        }
-        return {
-            insertAction: insertions,
-            removeAction: removals,
-            updateAction: updates,
-        };
-    }
-    toJSON() {
-        // if (this.__pendingAttributes) {
-        //   return [...this.__pendingAttributes, this.__toAttribute()];
-        // } else {
-        //   return [this.__toAttribute()];
-        // }
-        return [this.__toAttribute()];
-    }
-}
-export const __pendingListUpdates = {
-    values: {},
-    clear() {
-        this.values = {};
-    },
-    flush() {
-        Object.values(this.values).forEach(update => {
-            update.flush();
-        });
-        this.clear();
-    },
-};
+import { applyRefQueue } from './snapshot/workletRef.js';
 export const gSignMap = {};
 export const gRecycleMap = {};
+const gParentWeakMap = new WeakMap();
 export function clearListGlobal() {
     for (const key in gSignMap) {
         delete gSignMap[key];
@@ -190,7 +13,24 @@ export function clearListGlobal() {
         delete gRecycleMap[key];
     }
 }
-export function componentAtIndexFactory(ctx) {
+export function componentAtIndexFactory(ctx, hydrateFunction) {
+    // A hack workaround to ensure childCtx has no direct reference through `__parent` to list,
+    // to avoid memory leak.
+    // TODO(hzy): make `__parent` a WeakRef or `#__parent` in the future.
+    ctx.forEach((childCtx) => {
+        if (gParentWeakMap.has(childCtx)) {
+            // do it only once
+        }
+        else {
+            gParentWeakMap.set(childCtx, childCtx.parentNode);
+            Object.defineProperty(childCtx, '__parent', {
+                get: () => gParentWeakMap.get(childCtx),
+                set: (value) => {
+                    gParentWeakMap.set(childCtx, value);
+                },
+            });
+        }
+    });
     const componentAtIndex = (list, listID, cellIndex, operationID, enableReuseNotification, enableBatchRender = false, asyncFlush = false) => {
         const signMap = gSignMap[listID];
         const recycleMap = gRecycleMap[listID];
@@ -201,7 +41,7 @@ export function componentAtIndexFactory(ctx) {
         if (!childCtx) {
             throw new Error('childCtx not found');
         }
-        const platformInfo = childCtx.__listItemPlatformInfo || {};
+        const platformInfo = childCtx.__listItemPlatformInfo ?? {};
         const uniqID = childCtx.type + (platformInfo['reuse-identifier'] ?? '');
         const recycleSignMap = recycleMap.get(uniqID);
         if (childCtx.__elements) {
@@ -226,10 +66,8 @@ export function componentAtIndexFactory(ctx) {
                 else if (enableBatchRender && asyncFlush) {
                     __FlushElementTree(root, { asyncFlush: true });
                 }
-                else {
-                    // enableBatchRender == true && asyncFlush == false
-                    // in this case, no need to invoke __FlushElementTree because in the end of componentAtIndexes(), the list will invoke __FlushElementTree.
-                }
+                // enableBatchRender == true && asyncFlush == false
+                // in this case, no need to invoke __FlushElementTree because in the end of componentAtIndexes(), the list will invoke __FlushElementTree.
                 return sign;
             }
             else {
@@ -241,9 +79,13 @@ export function componentAtIndexFactory(ctx) {
             const [first] = recycleSignMap;
             const [sign, oldCtx] = first;
             recycleSignMap.delete(sign);
-            hydrate(oldCtx, childCtx);
+            hydrateFunction(oldCtx, childCtx);
             oldCtx.unRenderElements();
+            if (!oldCtx.__id) {
+                oldCtx.tearDown();
+            }
             const root = childCtx.__element_root;
+            applyRefQueue();
             if (!enableBatchRender) {
                 const flushOptions = {
                     triggerLayout: true,
@@ -272,13 +114,13 @@ export function componentAtIndexFactory(ctx) {
                 __FlushElementTree(root, flushOptions);
             }
             signMap.set(sign, childCtx);
-            commitMainThreadPatchUpdate(undefined);
             return sign;
         }
         childCtx.ensureElements();
         const root = childCtx.__element_root;
         __AppendElement(list, root);
         const sign = __GetElementUniqueID(root);
+        applyRefQueue();
         if (!enableBatchRender) {
             __FlushElementTree(root, {
                 triggerLayout: true,
@@ -293,7 +135,6 @@ export function componentAtIndexFactory(ctx) {
             });
         }
         signMap.set(sign, childCtx);
-        commitMainThreadPatchUpdate(undefined);
         return sign;
     };
     const componentAtIndexes = (list, listID, cellIndexes, operationIDs, enableReuseNotification, asyncFlush) => {
@@ -311,6 +152,7 @@ export function componentAtIndexFactory(ctx) {
     return [componentAtIndex, componentAtIndexes];
 }
 export function enqueueComponentFactory() {
+    // eslint-disable-next-line unicorn/consistent-function-scoping
     const enqueueComponent = (_, listID, sign) => {
         const signMap = gSignMap[listID];
         const recycleMap = gRecycleMap[listID];
@@ -321,7 +163,7 @@ export function enqueueComponentFactory() {
         if (!childCtx) {
             return;
         }
-        const platformInfo = childCtx.__listItemPlatformInfo || {};
+        const platformInfo = childCtx.__listItemPlatformInfo ?? {};
         const uniqID = childCtx.type + (platformInfo['reuse-identifier'] ?? '');
         if (!recycleMap.has(uniqID)) {
             recycleMap.set(uniqID, new Map());
@@ -330,21 +172,4 @@ export function enqueueComponentFactory() {
     };
     return enqueueComponent;
 }
-export function snapshotCreateList(pageId, _ctx, _expIndex) {
-    const signMap = new Map();
-    const recycleMap = new Map();
-    const [componentAtIndex, componentAtIndexes] = componentAtIndexFactory([]);
-    const list = __CreateList(pageId, componentAtIndex, enqueueComponentFactory(), {}, componentAtIndexes);
-    const listID = __GetElementUniqueID(list);
-    gSignMap[listID] = signMap;
-    gRecycleMap[listID] = recycleMap;
-    return list;
-}
-export function snapshotDestroyList(si) {
-    const [, elementIndex] = si.__snapshot_def.slot[0];
-    const list = si.__elements[elementIndex];
-    const listID = __GetElementUniqueID(list);
-    delete gSignMap[listID];
-    delete gRecycleMap[listID];
-}
 //# sourceMappingURL=list.js.map