fix: always import worklet-runtime.js & remove logs

Author: Yradex

packages/react/runtime/src/lifecycle/patch/commit.ts

@@ -31,8 +31,6 @@ import { takeWorkletRefInitValuePatch } from '../../worklet/workletRefPool.js';
 import { getReloadVersion } from '../pass.js';
 import type { SnapshotPatch } from './snapshotPatch.js';
 import { takeGlobalSnapshotPatch } from './snapshotPatch.js';
-import { prettyFormatSnapshotPatch } from '../../debug/formatPatch.js';
-import { printSnapshotInstance } from '../../debug/printSnapshot.js';
 
 let globalFlushOptions: FlushOptions = {};
 function takeGlobalFlushOptions() {
@@ -176,11 +174,11 @@ function commitPatchUpdate(patchList: PatchList, patchOptions: GlobalPatchOption
   data: string;
   patchOptions: PatchOptions;
 } {
-  console.debug('********** JS update:');
-  printSnapshotInstance(
-    (backgroundSnapshotInstanceManager.values.get(1) ?? backgroundSnapshotInstanceManager.values.get(-1))!,
-  );
-  console.debug('commitPatchUpdate:', prettyFormatSnapshotPatch(patchList.patchList[0]?.snapshotPatch));
+  // console.debug('********** JS update:');
+  // printSnapshotInstance(
+  //   (backgroundSnapshotInstanceManager.values.get(1) ?? backgroundSnapshotInstanceManager.values.get(-1))!,
+  // );
+  // console.debug('commitPatchUpdate:', prettyFormatSnapshotPatch(patchList.patchList[0]?.snapshotPatch));
 
   if (__PROFILE__) {
     console.profile('commitChanges');

packages/react/runtime/src/lifecycle/patch/updateMainThread.ts

@@ -7,12 +7,11 @@ import { updateWorkletRefInitValueChanges } from '@lynx-js/react/worklet-runtime
 import type { PatchList, PatchOptions } from './commit.js';
 import { setMainThreadHydrating } from './isMainThreadHydrating.js';
 import { snapshotPatchApply } from './snapshotPatchApply.js';
-import { printSnapshotInstance } from '../../debug/printSnapshot.js';
 import { LifecycleConstant } from '../../lifecycleConstant.js';
 import { markTiming, setPipeline } from '../../lynx/performance.js';
 import { __pendingListUpdates } from '../../pendingListUpdates.js';
 import { applyRefQueue } from '../../snapshot/workletRef.js';
-import { __page, snapshotInstanceManager } from '../../snapshot.js';
+import { __page } from '../../snapshot.js';
 import { getReloadVersion } from '../pass.js';
 
 function updateMainThread(
@@ -52,8 +51,8 @@ function updateMainThread(
         snapshotPatchApply(snapshotPatch);
       }
       __pendingListUpdates.flush();
-      console.debug('********** Lepus updatePatch:');
-      printSnapshotInstance(snapshotInstanceManager.values.get(-1)!);
+      // console.debug('********** Lepus updatePatch:');
+      // printSnapshotInstance(snapshotInstanceManager.values.get(-1)!);
     }
   } finally {
     markTiming('patchChangesEnd');

packages/react/runtime/src/snapshot.ts

@@ -557,7 +557,7 @@ export class SnapshotInstance {
   }
 
   insertBefore(newNode: SnapshotInstance, existingNode?: SnapshotInstance): void {
-    console.log('yra insertBefore', this.__id, newNode.__id);
+    // console.log('yra insertBefore', this.__id, newNode.__id);
     const __snapshot_def = this.__snapshot_def;
     if (__snapshot_def.isListHolder) {
       if (__pendingListUpdates.values) {
@@ -714,7 +714,7 @@ interface MTCProps extends Attributes {
 }
 
 function renderMTC(snapshotInstance: SnapshotInstance, props: MTCProps) {
-  console.log('yra renderMTC', snapshotInstance.__id, props);
+  // console.log('yra renderMTC', snapshotInstance.__id, props);
   if (snapshotInstance.__elements === undefined) {
     return;
   }

packages/react/runtime/src/snapshot/event.ts

@@ -2,6 +2,7 @@
 // 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 { loadWorkletRuntime } from '@lynx-js/react/worklet-runtime/bindings';
 import type { Worklet } from '@lynx-js/react/worklet-runtime/bindings';
 import type { BaseEvent } from '@lynx-js/types';
 
@@ -14,6 +15,20 @@ function registerMTCEvent(
   id: string,
   callback: undefined | ((e: BaseEvent) => void),
 ): Record<string, unknown> | undefined {
+  if (!globalThis.lynxWorkletImpl) {
+    // @ts-ignore
+    loadWorkletRuntime(typeof globDynamicComponentEntry === 'undefined' ? undefined : globDynamicComponentEntry);
+    // @ts-ignore
+    globalThis.runMTCEvent = (ctx: Worklet, e: [any]) => {
+      const event = {
+        ...e[0],
+        target: new Element(e[0].target.elementRefptr),
+        currentTarget: new Element(e[0].currentTarget.elementRefptr),
+      } as BaseEvent;
+      mtcEvents.get(ctx._wkltId)!(event);
+    };
+  }
+
   if (!callback) {
     mtcEvents.delete(id);
     return undefined;
@@ -28,16 +43,6 @@ function registerMTCEvent(
   };
 }
 
-// @ts-ignore
-globalThis.runWorklet = (ctx: Worklet, e: [any]) => {
-  const event = {
-    ...e[0],
-    target: new Element(e[0].target.elementRefptr),
-    currentTarget: new Element(e[0].currentTarget.elementRefptr),
-  } as BaseEvent;
-  mtcEvents.get(ctx._wkltId)!(event);
-};
-
 function updateEvent(
   snapshot: SnapshotInstance,
   expIndex: number,

packages/react/runtime/src/snapshot/ref.ts

@@ -72,7 +72,7 @@ function updateRef(
   }
 
   const value: unknown = snapshot.__values![expIndex];
-  console.log('yra updateRef', value);
+  // console.log('yra updateRef', value);
   let ref;
   if (!value) {
     // do nothing

packages/react/runtime/src/snapshot/workletRef.ts

@@ -41,7 +41,7 @@ export function addToRefQueue(worklet: Ref, element: Element): void {
 }
 
 export function workletUnRef(value: Ref): void {
-  console.log('yra workletUnRef', value);
+  // console.log('yra workletUnRef', value);
   if ('_wvid' in value) {
     update(value as WorkletRefImpl<Element>, null);
   } else if ('_wkltId' in value) {

packages/react/worklet-runtime/src/workletRuntime.ts

@@ -50,6 +50,11 @@ function runWorklet(ctx: Worklet, params: ClosureValueType[]): unknown {
     console.warn('Worklet: Invalid worklet object: ' + JSON.stringify(ctx));
     return;
   }
+  if (ctx._workletType === 'mtc') {
+    // @ts-ignore
+    globalThis.runMTCEvent(ctx, params);
+    return;
+  }
   if ('_lepusWorkletHash' in ctx) {
     delayExecUntilJsReady(ctx._lepusWorkletHash, params);
     return;

packages/webpack/react-webpack-plugin/src/ReactWebpackPlugin.ts

@@ -257,7 +257,7 @@ class ReactWebpackPlugin {
           if (
             lepusCode.root?.source.source().toString()?.includes(
               'registerWorkletInternal',
-            )
+            ) || true
           ) {
             const path = compiler.options.mode === 'development'
               ? '@lynx-js/react/worklet-dev-runtime'