Merge pull request #7686 from QwikDev/v2-memoizee-qrl-imports

perf(qrl): remove $lazyResolve$

Author: wmertens

.changeset/soft-insects-see.md

@@ -0,0 +1,5 @@
+---
+'@qwik.dev/core': patch
+---
+
+:zap: QRL segments now memoize imports, removing some Promises during render

packages/qwik/src/core/shared/qrl/qrl-class.ts

@@ -41,7 +41,7 @@ export type QRLInternalMethods<TYPE> = {
 
   resolved: undefined | TYPE;
 
-  resolve(): Promise<TYPE>;
+  resolve(containerEl?: Element): Promise<TYPE>;
   getSymbol(): string;
   getHash(): string;
   getCaptured(): unknown[] | null;
@@ -54,7 +54,6 @@ export type QRLInternalMethods<TYPE> = {
       unknown;
 
   $setContainer$(containerEl: Element | undefined): Element | undefined;
-  $resolveLazy$(containerEl?: Element): ValueOrPromise<TYPE>;
 };
 
 export type QRLInternal<TYPE = unknown> = QRL<TYPE> & QRLInternalMethods<TYPE>;
@@ -128,10 +127,6 @@ export const createQRL = <TYPE>(
     return bound;
   }
 
-  const resolveLazy = (containerEl?: Element): ValueOrPromise<TYPE> => {
-    return symbolRef !== null ? symbolRef : resolve(containerEl);
-  };
-
   // Wrap functions to provide their lexical scope
   const wrapFn = (fn: TYPE): TYPE => {
     if (typeof fn !== 'function' || (!capture?.length && !captureRef?.length)) {
@@ -205,7 +200,7 @@ export const createQRL = <TYPE>(
           const imported = getPlatform().importSymbol(_containerEl, chunk, symbol);
           symbolRef = maybeThen(imported, (ref) => (qrl.resolved = wrapFn((symbolRef = ref))));
         }
-        if (typeof symbolRef === 'object' && isPromise(symbolRef)) {
+        if (isPromise(symbolRef)) {
           symbolRef.then(
             () => emitUsedSymbol(symbol, ctx?.$element$, start),
             (err) => {
@@ -235,7 +230,6 @@ export const createQRL = <TYPE>(
     getHash: () => hash,
     getCaptured: () => captureRef,
     resolve,
-    $resolveLazy$: resolveLazy,
     $setContainer$: setContainer,
     $chunk$: chunk,
     $symbol$: symbol,

packages/qwik/src/core/use/use-styles.ts

@@ -3,7 +3,6 @@ import { implicit$FirstArg } from '../shared/qrl/implicit_dollar';
 import { getScopedStyles } from '../shared/utils/scoped-stylesheet';
 import { useSequentialScope } from './use-sequential-scope';
 import { assertQrl } from '../shared/qrl/qrl-utils';
-import { isPromise } from '../shared/utils/promises';
 import { ComponentStylesPrefixContent } from '../shared/utils/markers';
 import { styleKey } from '../shared/utils/styles';
 
@@ -96,14 +95,14 @@ const _useStyles = (
   const host = iCtx.$hostElement$;
   set(styleId);
 
-  const value = styleQrl.$resolveLazy$(iCtx.$element$);
-  if (isPromise(value)) {
-    value.then((val) =>
-      iCtx.$container$.$appendStyle$(transform(val, styleId), styleId, host, scoped)
-    );
-    throw value;
+  if (styleQrl.resolved) {
+    iCtx.$container$.$appendStyle$(transform(styleQrl.resolved, styleId), styleId, host, scoped);
   } else {
-    iCtx.$container$.$appendStyle$(transform(value, styleId), styleId, host, scoped);
+    throw styleQrl
+      .resolve()
+      .then((val) =>
+        iCtx.$container$.$appendStyle$(transform(val, styleId), styleId, host, scoped)
+      );
   }
 
   return styleId;

packages/qwik/src/core/use/use-visible-task.ts

@@ -1,6 +1,6 @@
 import type { EventHandler } from '../shared/jsx/types/jsx-qwik-attributes';
 import { isServerPlatform } from '../shared/platform/platform';
-import { createQRL } from '../shared/qrl/qrl-class';
+import { createQRL, type QRLInternal } from '../shared/qrl/qrl-class';
 import { assertQrl } from '../shared/qrl/qrl-utils';
 import type { QRL } from '../shared/qrl/qrl.public';
 import { ChoreType } from '../shared/util-chore-type';
@@ -42,7 +42,7 @@ export const useVisibleTaskQrl = (qrl: QRL<TaskFn>, opts?: OnVisibleTaskOptions)
   set(task);
   useRunTask(task, eagerness);
   if (!isServerPlatform()) {
-    qrl.$resolveLazy$(iCtx.$element$);
+    (qrl as QRLInternal).resolve(iCtx.$element$);
     iCtx.$container$.$scheduler$(ChoreType.VISIBLE, task);
   }
 };