@qwik.dev/core 2.0.0-beta.2 → 2.0.0-beta.4

package/dist/core.mjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core 2.0.0-beta.2-dev+3ddc6c7
+ * @qwik.dev/core 2.0.0-beta.4-dev+9849dcf
  * Copyright QwikDev. All Rights Reserved.
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://github.com/QwikDev/qwik/blob/main/LICENSE
@@ -72,6 +72,24 @@ const createAndLogError = (asyncThrow, message, ...optionalParams) => {
     return err;
 };
 
+/** @private */
+const isSerializableObject = (v) => {
+    const proto = Object.getPrototypeOf(v);
+    return proto === Object.prototype || proto === Array.prototype || proto === null;
+};
+const isObject = (v) => {
+    return typeof v === 'object' && v !== null;
+};
+const isArray = (v) => {
+    return Array.isArray(v);
+};
+const isString = (v) => {
+    return typeof v === 'string';
+};
+const isFunction = (v) => {
+    return typeof v === 'function';
+};
+
 const codeToText = (code, ...parts) => {
     if (qDev) {
         // Keep one error, one line to make it easier to search for the error message.
@@ -116,7 +134,7 @@ const codeToText = (code, ...parts) => {
         if (parts.length) {
             text = text.replaceAll(/{{(\d+)}}/g, (_, index) => {
                 let v = parts[index];
-                if (v && typeof v === 'object' && v.constructor === Object) {
+                if (v && isObject(v) && v.constructor === Object) {
                     v = JSON.stringify(v).slice(0, 50);
                 }
                 return v;
@@ -377,7 +395,7 @@ const delay = (timeout) => {
         setTimeout(resolve, timeout);
     });
 };
-// Retries a function that throws a promise.
+/** Retries a function that throws a promise. */
 function retryOnPromise(fn, retryCount = 0) {
     const retryOrThrow = (e) => {
         if (isPromise(e) && retryCount < MAX_RETRY_ON_PROMISE_COUNT) {
@@ -402,24 +420,6 @@ function retryOnPromise(fn, retryCount = 0) {
     }
 }
 
-/** @private */
-const isSerializableObject = (v) => {
-    const proto = Object.getPrototypeOf(v);
-    return proto === Object.prototype || proto === Array.prototype || proto === null;
-};
-const isObject = (v) => {
-    return !!v && typeof v === 'object';
-};
-const isArray = (v) => {
-    return Array.isArray(v);
-};
-const isString = (v) => {
-    return typeof v === 'string';
-};
-const isFunction = (v) => {
-    return typeof v === 'function';
-};
-
 const ASSERT_DISCLAIMER = 'Internal assert, this is likely caused by a bug in Qwik: ';
 function assertDefined(value, text, ...parts) {
     if (qDev) {
@@ -639,11 +639,9 @@ class WrappedSignalImpl extends SignalImpl {
         this.$funcStr$ = fnStr;
         this.$flags$ = flags;
     }
-    $invalidate$() {
+    invalidate() {
         this.$flags$ |= 1 /* SignalFlags.INVALID */;
         this.$forceRunEffects$ = false;
-        // We should only call subscribers if the calculation actually changed.
-        // Therefore, we need to calculate the value now.
         this.$container$?.$scheduler$(7 /* ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS */, this.$hostElement$, this, this.$effects$);
     }
     /**
@@ -651,9 +649,8 @@ class WrappedSignalImpl extends SignalImpl {
      * remained the same object.
      */
     force() {
-        this.$flags$ |= 1 /* SignalFlags.INVALID */;
-        this.$forceRunEffects$ = false;
-        triggerEffects(this.$container$, this, this.$effects$);
+        this.$forceRunEffects$ = true;
+        this.$container$?.$scheduler$(7 /* ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS */, this.$hostElement$, this, this.$effects$);
     }
     get untrackedValue() {
         const didChange = this.$computeIfNeeded$();
@@ -711,7 +708,6 @@ function isSsrNode(value) {
 }
 
 let _context;
-/** @public */
 const tryGetInvokeContext = () => {
     if (!_context) {
         const context = typeof document !== 'undefined' && document && document.__q_context__;
@@ -732,6 +728,7 @@ const getInvokeContext = () => {
     }
     return ctx;
 };
+/** @internal */
 const useInvokeContext = () => {
     const ctx = tryGetInvokeContext();
     if (!ctx || ctx.$event$ !== RenderEvent) {
@@ -777,7 +774,7 @@ const newInvokeContextFromTuple = ([element, event, url]) => {
 // TODO how about putting url and locale (and event/custom?) in to a "static" object
 const newInvokeContext = (locale, hostElement, element, event, url) => {
     // ServerRequestEvent has .locale, but it's not always defined.
-    const $locale$ = locale || (typeof event === 'object' && event && 'locale' in event ? event.locale : undefined);
+    const $locale$ = locale || (event && isObject(event) && 'locale' in event ? event.locale : undefined);
     const ctx = {
         $url$: url,
         $i$: 0,
@@ -857,6 +854,13 @@ const _getContextEvent = () => {
     }
 };
 /** @internal */
+const _getContextContainer = () => {
+    const iCtx = tryGetInvokeContext();
+    if (iCtx) {
+        return iCtx.$container$;
+    }
+};
+/** @internal */
 const _jsxBranch = (input) => {
     return input;
 };
@@ -1230,7 +1234,7 @@ const isRecoverable = (err) => {
  *
  * @public
  */
-const version = "2.0.0-beta.2-dev+3ddc6c7";
+const version = "2.0.0-beta.4-dev+9849dcf";
 
 /** @internal */
 const EMPTY_ARRAY = [];
@@ -1395,6 +1399,8 @@ const _CONST_PROPS = Symbol('CONST');
 const _VAR_PROPS = Symbol('VAR');
 /** @internal @deprecated v1 compat */
 const _IMMUTABLE = Symbol('IMMUTABLE');
+/** @internal */
+const _UNINITIALIZED = Symbol('UNINITIALIZED');
 
 // <docs markdown="../../readme.md#implicit$FirstArg">
 // !!DO NOT EDIT THIS COMMENT DIRECTLY!!!
@@ -1464,14 +1470,15 @@ class ComputedSignalImpl extends SignalImpl {
     constructor(container, fn, 
     // We need a separate flag to know when the computation needs running because
     // we need the old value to know if effects need running after computation
-    flags = 1 /* SignalFlags.INVALID */) {
+    flags = 1 /* SignalFlags.INVALID */ |
+        16 /* ComputedSignalFlags.SERIALIZATION_STRATEGY_ALWAYS */) {
         // The value is used for comparison when signals trigger, which can only happen
         // when it was calculated before. Therefore we can pass whatever we like.
         super(container, NEEDS_COMPUTATION);
         this.$computeQrl$ = fn;
         this.$flags$ = flags;
     }
-    $invalidate$() {
+    invalidate() {
         this.$flags$ |= 1 /* SignalFlags.INVALID */;
         this.$forceRunEffects$ = false;
         this.$container$?.$scheduler$(7 /* ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS */, null, this, this.$effects$);
@@ -1541,7 +1548,7 @@ class ComputedSignalImpl extends SignalImpl {
  */
 class SerializerSignalImpl extends ComputedSignalImpl {
     constructor(container, argQrl) {
-        super(container, argQrl);
+        super(container, argQrl, 1 /* SignalFlags.INVALID */ | 16 /* ComputedSignalFlags.SERIALIZATION_STRATEGY_ALWAYS */);
     }
     $didInitialize$ = false;
     $computeIfNeeded$() {
@@ -1557,7 +1564,7 @@ class SerializerSignalImpl extends ComputedSignalImpl {
         const update = arg.update;
         const currentValue = this.$untrackedValue$ === NEEDS_COMPUTATION ? initial : this.$untrackedValue$;
         const untrackedValue = trackSignal(() => this.$didInitialize$
-            ? update?.(currentValue)
+            ? update?.(currentValue) || currentValue
             : deserialize(currentValue), this, "." /* EffectProperty.VNODE */, this.$container$);
         const didChange = (this.$didInitialize$ && untrackedValue !== 'undefined') ||
             untrackedValue !== this.$untrackedValue$;
@@ -1646,8 +1653,7 @@ class StoreHandler {
         }
         const flags = this.$flags$;
         if (flags & 1 /* StoreFlags.RECURSIVE */ &&
-            typeof value === 'object' &&
-            value !== null &&
+            isObject(value) &&
             !Object.isFrozen(value) &&
             !isStore(value) &&
             !Object.isFrozen(target)) {
@@ -1825,7 +1831,7 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
     $loadingEffects$ = null;
     $errorEffects$ = null;
     $destroy$;
-    $promiseValue$ = null;
+    $promiseValue$ = NEEDS_COMPUTATION;
     [_EFFECT_BACK_REF] = null;
     constructor(container, fn, flags = 1 /* SignalFlags.INVALID */) {
         super(container, fn, flags);
@@ -1859,6 +1865,10 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
     get untrackedError() {
         return this.$untrackedError$;
     }
+    invalidate() {
+        super.invalidate();
+        this.$promiseValue$ = NEEDS_COMPUTATION;
+    }
     $computeIfNeeded$() {
         if (!(this.$flags$ & 1 /* SignalFlags.INVALID */)) {
             return false;
@@ -1866,11 +1876,12 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
         const computeQrl = this.$computeQrl$;
         throwIfQRLNotResolved(computeQrl);
         const [cleanup] = cleanupFn(this, (err) => this.$container$?.handleError(err, null));
-        const untrackedValue = this.$promiseValue$ ??
-            computeQrl.getFn()({
+        const untrackedValue = this.$promiseValue$ === NEEDS_COMPUTATION
+            ? computeQrl.getFn()({
                 track: trackFn(this, this.$container$),
                 cleanup,
-            });
+            })
+            : this.$promiseValue$;
         if (isPromise(untrackedValue)) {
             this.untrackedLoading = true;
             this.untrackedError = null;
@@ -1881,11 +1892,12 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
                 this.untrackedError = null;
             })
                 .catch((err) => {
+                this.$promiseValue$ = err;
                 this.untrackedLoading = false;
                 this.untrackedError = err;
             });
         }
-        this.$promiseValue$ = null;
+        this.$promiseValue$ = NEEDS_COMPUTATION;
         this.$flags$ &= -2 /* SignalFlags.INVALID */;
         const didChange = untrackedValue !== this.$untrackedValue$;
         if (didChange) {
@@ -1900,13 +1912,15 @@ const createSignal$1 = (value) => {
     return new SignalImpl(null, value);
 };
 /** @internal */
-const createComputedSignal = (qrl) => {
-    throwIfQRLNotResolved(qrl);
-    return new ComputedSignalImpl(null, qrl);
+const createComputedSignal = (qrl, options) => {
+    return new ComputedSignalImpl(options?.container || null, qrl, getComputedSignalFlags(options?.serializationStrategy || 'always'));
+};
+/** @internal */
+const createAsyncComputedSignal = (qrl, options) => {
+    return new AsyncComputedSignalImpl(options?.container || null, qrl, getComputedSignalFlags(options?.serializationStrategy || 'never'));
 };
 /** @internal */
 const createSerializerSignal = (arg) => {
-    throwIfQRLNotResolved(arg);
     return new SerializerSignalImpl(null, arg);
 };
 
@@ -1925,11 +1939,22 @@ const createSignal = createSignal$1;
  * The QRL must be a function which returns the value of the signal. The function must not have side
  * effects, and it must be synchronous.
  *
- * If you need the function to be async, use `useSignal` and `useTask$` instead.
+ * If you need the function to be async, use `useAsyncComputed$` instead.
  *
  * @public
  */
 const createComputed$ = /*#__PURE__*/ implicit$FirstArg(createComputedSignal);
+/**
+ * Create an async computed signal which is calculated from the given QRL. A computed signal is a
+ * signal which is calculated from other signals or async operation. When the signals change, the
+ * computed signal is recalculated.
+ *
+ * The QRL must be a function which returns the value of the signal. The function must not have side
+ * effects, and it can be async.
+ *
+ * @public
+ */
+const createAsyncComputed$ = /*#__PURE__*/ implicit$FirstArg(createAsyncComputedSignal);
 /**
  * Create a signal that holds a custom serializable value. See {@link useSerializer$} for more
  * details.
@@ -1989,17 +2014,6 @@ const _wrapProp = (...args) => {
     // the object is not reactive, so we can just return the value
     return obj[prop];
 };
-/** @internal */
-const _wrapStore = (obj, prop) => {
-    const target = getStoreTarget(obj);
-    const value = target[prop];
-    if (isSignal(value)) {
-        return value;
-    }
-    else {
-        return new WrappedSignalImpl(null, getProp, [obj, prop], null, 1 /* SignalFlags.INVALID */);
-    }
-};
 /** @internal @deprecated v1 compat */
 const _wrapSignal = (obj, prop) => {
     const r = _wrapProp(obj, prop);
@@ -2421,7 +2435,6 @@ const executeComponent = (container, renderHost, subscriptionHost, componentQRL,
         if (!isInlineComponent) {
             container.setHostProp(renderHost, ELEMENT_SEQ_IDX, null);
             container.setHostProp(renderHost, USE_ON_LOCAL_SEQ_IDX, null);
-            container.setHostProp(renderHost, ELEMENT_PROPS, props);
         }
         if (vnode_isVNode(renderHost)) {
             clearAllEffects(container, renderHost);
@@ -2435,9 +2448,12 @@ const executeComponent = (container, renderHost, subscriptionHost, componentQRL,
         return jsx;
     }, (err) => {
         if (isPromise(err) && retryCount < MAX_RETRY_ON_PROMISE_COUNT) {
-            return err.then(() => executeComponentWithPromiseExceptionRetry(retryCount++));
+            return err.then(() => executeComponentWithPromiseExceptionRetry(++retryCount));
         }
         else {
+            if (retryCount >= MAX_RETRY_ON_PROMISE_COUNT) {
+                throw new Error(`Max retry count of component execution reached`);
+            }
             throw err;
         }
     });
@@ -4540,16 +4556,36 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 shouldRender = true;
             }
             if (host) {
-                const vNodeProps = vnode_getProp(host, ELEMENT_PROPS, container.$getObjectById$);
-                shouldRender = shouldRender || propsDiffer(jsxProps, vNodeProps);
+                let vNodeProps = vnode_getProp(host, ELEMENT_PROPS, container.$getObjectById$);
+                const propsAreDifferent = propsDiffer(jsxProps, vNodeProps);
+                shouldRender = shouldRender || propsAreDifferent;
                 if (shouldRender) {
+                    if (propsAreDifferent) {
+                        if (vNodeProps) {
+                            // Reuse the same props instance, qrls can use the current props instance
+                            // as a capture ref, so we can't change it.
+                            // We need to do this directly, because normally we would subscribe to the signals
+                            // if any signal is there.
+                            vNodeProps[_CONST_PROPS] = jsxProps[_CONST_PROPS];
+                            vNodeProps[_VAR_PROPS] = jsxProps[_VAR_PROPS];
+                        }
+                        else if (jsxProps) {
+                            // If there is no props instance, create a new one.
+                            // We can do this because we are not using the props instance for anything else.
+                            vnode_setProp(host, ELEMENT_PROPS, jsxProps);
+                            vNodeProps = jsxProps;
+                        }
+                    }
+                    // Assign the new QRL instance to the host.
+                    // Unfortunately it is created every time, something to fix in the optimizer.
+                    vnode_setProp(host, OnRenderProp, componentQRL);
                     /**
                      * Mark host as not deleted. The host could have been marked as deleted if it there was a
                      * cleanup run. Now we found it and want to reuse it, so we need to mark it as not
                      * deleted.
                      */
                     host[0 /* VNodeProps.flags */] &= -33 /* VNodeFlags.Deleted */;
-                    container.$scheduler$(6 /* ChoreType.COMPONENT */, host, componentQRL, jsxProps);
+                    container.$scheduler$(6 /* ChoreType.COMPONENT */, host, componentQRL, vNodeProps);
                 }
             }
             descendContentToProject(jsxNode.children, host);
@@ -4980,10 +5016,12 @@ function getResourceValueAsPromise(props) {
         return resource.then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
     }
     else if (isSignal(resource)) {
-        return Promise.resolve(resource.value).then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
+        const value = retryOnPromise(() => resource.value);
+        const promise = isPromise(value) ? value : Promise.resolve(value);
+        return promise.then(useBindInvokeContext(props.onResolved));
     }
     else {
-        return Promise.resolve(resource).then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
+        return Promise.resolve(resource).then(useBindInvokeContext(props.onResolved));
     }
 }
 const _createResourceReturn = (opts) => {
@@ -5509,22 +5547,23 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
                     {
                         const target = chore.$target$;
                         const effects = chore.$payload$;
+                        const ctx = newInvokeContext();
+                        ctx.$container$ = container;
                         if (target instanceof ComputedSignalImpl || target instanceof WrappedSignalImpl) {
                             const forceRunEffects = target.$forceRunEffects$;
                             target.$forceRunEffects$ = false;
-                            if (!target.$effects$?.size) {
+                            if (!effects?.size && !forceRunEffects) {
                                 break;
                             }
-                            returnValue = retryOnPromise(() => {
-                                if (target.$computeIfNeeded$() || forceRunEffects) {
-                                    triggerEffects(container, target, effects);
+                            // needed for computed signals and throwing QRLs
+                            returnValue = maybeThen(retryOnPromise(() => invoke.call(target, ctx, target.$computeIfNeeded$)), (didChange) => {
+                                if (didChange || forceRunEffects) {
+                                    return retryOnPromise(() => triggerEffects(container, target, effects));
                                 }
                             });
                         }
                         else {
-                            returnValue = retryOnPromise(() => {
-                                triggerEffects(container, target, effects);
-                            });
+                            returnValue = retryOnPromise(() => triggerEffects(container, target, effects));
                         }
                     }
                     break;
@@ -5606,7 +5645,10 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
             return idxDiff;
         }
         // If the host is the same (or missing), and the type is the same,  we need to compare the target.
-        if (a.$target$ !== b.$target$ || a.$payload$ !== b.$payload$) {
+        if (a.$target$ !== b.$target$) {
+            if (isQrl(a.$target$) && isQrl(b.$target$) && a.$target$.$hash$ === b.$target$.$hash$) {
+                return 0;
+            }
             // 1 means that we are going to process chores as FIFO
             return 1;
         }
@@ -5654,7 +5696,7 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
          * multiple times during component execution. For this reason it is necessary for us to update
          * the chore with the latest result of the signal.
          */
-        if (existing.$type$ === 4 /* ChoreType.NODE_DIFF */) {
+        if (existing.$payload$ !== value.$payload$) {
             existing.$payload$ = value.$payload$;
         }
         if (existing.$executed$) {
@@ -6454,7 +6496,7 @@ const triggerEffects = (container, signal, effects) => {
                         container.$scheduler$(1 /* ChoreType.QRL_RESOLVE */, null, consumer.$computeQrl$);
                     }
                 }
-                consumer.$invalidate$();
+                consumer.invalidate();
             }
             else if (property === ":" /* EffectProperty.COMPONENT */) {
                 const host = consumer;
@@ -6489,7 +6531,23 @@ const triggerEffects = (container, signal, effects) => {
 };
 /** @internal */
 const isSerializerObj = (obj) => {
-    return (typeof obj === 'object' && obj !== null && typeof obj[SerializerSymbol] === 'function');
+    return isObject(obj) && typeof obj[SerializerSymbol] === 'function';
+};
+const getComputedSignalFlags = (serializationStrategy) => {
+    let flags = 1 /* SignalFlags.INVALID */;
+    switch (serializationStrategy) {
+        // TODO: implement this in the future
+        // case 'auto':
+        //   flags |= ComputedSignalFlags.SERIALIZATION_STRATEGY_AUTO;
+        //   break;
+        case 'never':
+            flags |= 8 /* ComputedSignalFlags.SERIALIZATION_STRATEGY_NEVER */;
+            break;
+        case 'always':
+            flags |= 16 /* ComputedSignalFlags.SERIALIZATION_STRATEGY_ALWAYS */;
+            break;
+    }
+    return flags;
 };
 
 const stringifyPath = [];
@@ -7786,12 +7844,15 @@ const processVNodeData = (vData, callback) => {
     let nextToConsumeIdx = 0;
     let ch = 0;
     let peekCh = 0;
+    const getChar = (idx) => {
+        return idx < vData.length ? vData.charCodeAt(idx) : 0;
+    };
     const peek = () => {
         if (peekCh !== 0) {
             return peekCh;
         }
         else {
-            return (peekCh = nextToConsumeIdx < vData.length ? vData.charCodeAt(nextToConsumeIdx) : 0);
+            return (peekCh = getChar(nextToConsumeIdx));
         }
     };
     const consume = () => {
@@ -7812,7 +7873,7 @@ const processVNodeData = (vData, callback) => {
         return vData.substring(start, nextToConsumeIdx);
     };
     while (peek() !== 0) {
-        callback(peek, consumeValue, consume, nextToConsumeIdx);
+        callback(peek, consumeValue, consume, getChar, nextToConsumeIdx);
     }
 };
 const vnode_getNextSibling = (vnode) => {
@@ -8026,21 +8087,19 @@ function materializeFromVNodeData(vParent, vData, element, child) {
     let textIdx = 0;
     let combinedText = null;
     let container = null;
-    processVNodeData(vData, (peek, consumeValue, consume, nextToConsumeIdx) => {
+    processVNodeData(vData, (peek, consumeValue, consume, getChar, nextToConsumeIdx) => {
         if (isNumber(peek())) {
             // Element counts get encoded as numbers.
-            while (!isElement(child)) {
+            while (!isElement(child) ||
+                // We pretend that style element's don't exist as they can get moved out.
+                // skip over style elements, as those need to be moved to the head
+                // and are not included in the counts.
+                isQStyleElement(child)) {
                 child = fastNextSibling(child);
                 if (!child) {
                     throw qError(27 /* QError.materializeVNodeDataError */, [vData, peek(), nextToConsumeIdx]);
                 }
             }
-            // We pretend that style element's don't exist as they can get moved out.
-            while (isQStyleElement(child)) {
-                // skip over style elements, as those need to be moved to the head
-                // and are not included in the counts.
-                child = fastNextSibling(child);
-            }
             combinedText = null;
             previousTextNode = null;
             let value = 0;
@@ -8072,7 +8131,17 @@ function materializeFromVNodeData(vParent, vData, element, child) {
             vnode_setAttr(null, vParent, ELEMENT_PROPS, consumeValue());
         }
         else if (peek() === VNodeDataChar.KEY) {
-            vnode_setAttr(null, vParent, ELEMENT_KEY, consumeValue());
+            const isEscapedValue = getChar(nextToConsumeIdx + 1) === VNodeDataChar.SEPARATOR;
+            let value;
+            if (isEscapedValue) {
+                consume();
+                value = decodeURI(consumeValue());
+                consume();
+            }
+            else {
+                value = consumeValue();
+            }
+            vnode_setAttr(null, vParent, ELEMENT_KEY, value);
         }
         else if (peek() === VNodeDataChar.SEQ) {
             vnode_setAttr(null, vParent, ELEMENT_SEQ, consumeValue());
@@ -8118,6 +8187,10 @@ function materializeFromVNodeData(vParent, vData, element, child) {
             vnode_setAttr(null, vParent, QSlot, consumeValue());
         }
         else {
+            // skip over style elements in front of text nodes, where text node is the first child (except the style node)
+            while (isQStyleElement(child)) {
+                child = fastNextSibling(child);
+            }
             const textNode = child && fastNodeType(child) === /* Node.TEXT_NODE */ 3 ? child : null;
             // must be alphanumeric
             if (combinedText === null) {
@@ -8214,7 +8287,7 @@ const VNodeArray = class VNode extends Array {
 /** There's [documentation](./serialization.md) */
 const deserializedProxyMap = new WeakMap();
 const isDeserializerProxy = (value) => {
-    return typeof value === 'object' && value !== null && SERIALIZER_PROXY_UNWRAP in value;
+    return isObject(value) && SERIALIZER_PROXY_UNWRAP in value;
 };
 const SERIALIZER_PROXY_UNWRAP = Symbol('UNWRAP');
 /** Call this on the serialized root state */
@@ -8422,9 +8495,7 @@ const inflate = (container, target, typeId, data) => {
             if (hasValue) {
                 asyncComputed.$untrackedValue$ = d[6];
             }
-            else {
-                asyncComputed.$flags$ |= 1 /* SignalFlags.INVALID */;
-            }
+            asyncComputed.$flags$ |= 1 /* SignalFlags.INVALID */;
             break;
         }
         // Inflating a SerializerSignal is the same as inflating a ComputedSignal
@@ -8524,7 +8595,7 @@ const inflate = (container, target, typeId, data) => {
             propsProxy[_VAR_PROPS] = data === 0 ? {} : data[0];
             propsProxy[_CONST_PROPS] = data[1];
             break;
-        case 35 /* TypeIds.EffectData */: {
+        case 35 /* TypeIds.SubscriptionData */: {
             const effectData = target;
             effectData.data.$scopedStyleIdPrefix$ = data[0];
             effectData.data.$isConst$ = data[1];
@@ -8545,6 +8616,7 @@ const _constants = [
     EMPTY_OBJ,
     NEEDS_COMPUTATION,
     STORE_ALL_PROPS,
+    _UNINITIALIZED,
     Slot,
     Fragment,
     NaN,
@@ -8564,6 +8636,7 @@ const _constantNames = [
     'EMPTY_OBJ',
     'NEEDS_COMPUTATION',
     'STORE_ALL_PROPS',
+    '_UNINITIALIZED',
     'Slot',
     'Fragment',
     'NaN',
@@ -8585,7 +8658,13 @@ const allocate = (container, typeId, value) => {
             if (!container.$forwardRefs$) {
                 throw qError(18 /* QError.serializeErrorCannotAllocate */, ['forward ref']);
             }
-            return container.$getObjectById$(container.$forwardRefs$[value]);
+            const rootRef = container.$forwardRefs$[value];
+            if (rootRef === -1) {
+                return _UNINITIALIZED;
+            }
+            else {
+                return container.$getObjectById$(rootRef);
+            }
         case 2 /* TypeIds.ForwardRefs */:
             return value;
         case 3 /* TypeIds.Constant */:
@@ -8680,7 +8759,7 @@ const allocate = (container, typeId, value) => {
             else {
                 throw qError(17 /* QError.serializeErrorExpectedVNode */, [typeof vNode]);
             }
-        case 35 /* TypeIds.EffectData */:
+        case 35 /* TypeIds.SubscriptionData */:
             return new SubscriptionData({});
         default:
             throw qError(18 /* QError.serializeErrorCannotAllocate */, [typeId]);
@@ -8742,7 +8821,7 @@ DomRefConstructor, symbolToChunkResolver, getProp, setProp, storeProxyMap, write
         };
     }
     const seenObjsMap = new Map();
-    const rootsPathMap = new Map();
+    const objectPathStringCache = new Map();
     const syncFnMap = new Map();
     const syncFns = [];
     const roots = [];
@@ -8751,7 +8830,7 @@ DomRefConstructor, symbolToChunkResolver, getProp, setProp, storeProxyMap, write
         return seenObjsMap.set(obj, { $parent$: parent, $index$: index, $rootIndex$: -1 });
     };
     const $addRootPath$ = (obj) => {
-        const rootPath = rootsPathMap.get(obj);
+        const rootPath = objectPathStringCache.get(obj);
         if (rootPath) {
             return rootPath;
         }
@@ -8770,7 +8849,7 @@ DomRefConstructor, symbolToChunkResolver, getProp, setProp, storeProxyMap, write
             current = seenObjsMap.get(current.$parent$);
         }
         const pathStr = path.length > 1 ? path.join(' ') : path.length ? path[0] : seen.$index$;
-        rootsPathMap.set(obj, pathStr);
+        objectPathStringCache.set(obj, pathStr);
         return pathStr;
     };
     const $addRoot$ = (obj, parent = null) => {
@@ -8837,7 +8916,7 @@ DomRefConstructor, symbolToChunkResolver, getProp, setProp, storeProxyMap, write
         $storeProxyMap$: storeProxyMap,
         $getProp$: getProp,
         $setProp$: setProp,
-        $pathMap$: rootsPathMap,
+        $objectPathStringCache$: objectPathStringCache,
     };
 };
 function $discoverRoots$(serializationContext, obj, parent, index) {
@@ -8861,7 +8940,8 @@ const discoverValuesForVNodeData = (vnodeData, callback) => {
             for (let i = 1; i < value.length; i += 2) {
                 const keyValue = value[i - 1];
                 const attrValue = value[i];
-                if (typeof attrValue === 'string' ||
+                if (attrValue == null ||
+                    typeof attrValue === 'string' ||
                     // skip empty props
                     (keyValue === ELEMENT_PROPS &&
                         Object.keys(attrValue).length === 0)) {
@@ -8886,6 +8966,14 @@ class PromiseResult {
         this.$qrl$ = $qrl$;
     }
 }
+class SerializationWeakRef {
+    $obj$;
+    constructor($obj$) {
+        this.$obj$ = $obj$;
+    }
+}
+/** @internal */
+const _serializationWeakRef = (obj) => new SerializationWeakRef(obj);
 /**
  * Format:
  *
@@ -8896,12 +8984,14 @@ class PromiseResult {
  * - Therefore root indexes need to be doubled to get the actual index.
  */
 async function serialize(serializationContext) {
-    const { $writer$, $isSsrNode$, $isDomRef$, $storeProxyMap$, $addRoot$, $pathMap$, $wasSeen$ } = serializationContext;
+    const { $writer$, $isSsrNode$, $isDomRef$, $storeProxyMap$, $addRoot$, $objectPathStringCache$, $wasSeen$, } = serializationContext;
     let depth = 0;
+    let rootIdx = 0;
     const forwardRefs = [];
     let forwardRefsId = 0;
     const promises = new Set();
     const preloadQrls = new Set();
+    const s11nWeakRefs = new Map();
     let parent = null;
     const isRootObject = () => depth === 0;
     const outputArray = (value, writeFn) => {
@@ -8946,19 +9036,41 @@ async function serialize(serializationContext) {
     };
     const addPreloadQrl = (qrl) => {
         preloadQrls.add(qrl);
-        serializationContext.$addRoot$(qrl, null);
+        serializationContext.$addRoot$(qrl);
     };
-    const outputRootRef = (value, rootDepth = 0) => {
+    const outputAsRootRef = (value, rootDepth = 0) => {
         const seen = $wasSeen$(value);
-        const rootRefPath = $pathMap$.get(value);
+        const rootRefPath = $objectPathStringCache$.get(value);
+        // Objects are the only way to create circular dependencies.
+        // So the first thing to to is to see if we have a circular dependency.
+        // (NOTE: For root objects we need to serialize them regardless if we have seen
+        //        them before, otherwise the root object reference will point to itself.)
+        // Also note that depth will be 1 for objects in root
         if (rootDepth === depth && seen && seen.$parent$ !== null && rootRefPath) {
             output(0 /* TypeIds.RootRef */, rootRefPath);
             return true;
         }
         else if (depth > rootDepth && seen && seen.$rootIndex$ !== -1) {
+            // We have seen this object before, so we can serialize it as a reference.
+            // Otherwise serialize as normal
             output(0 /* TypeIds.RootRef */, seen.$rootIndex$);
             return true;
         }
+        else if (s11nWeakRefs.has(value)) {
+            const forwardRefId = s11nWeakRefs.get(value);
+            // We see the object again, we must now make it a root and update the forward ref
+            if (rootDepth === depth) {
+                // It's already a root
+                forwardRefs[forwardRefId] = rootIdx;
+            }
+            else {
+                // ref
+                const rootRef = $addRoot$(value);
+                output(0 /* TypeIds.RootRef */, rootRef);
+                forwardRefs[forwardRefId] = rootRef;
+                return true;
+            }
+        }
         return false;
     };
     const writeValue = (value) => {
@@ -8973,13 +9085,13 @@ async function serialize(serializationContext) {
         }
         else if (typeof value === 'function') {
             if (value === Slot) {
-                output(3 /* TypeIds.Constant */, 9 /* Constants.Slot */);
+                output(3 /* TypeIds.Constant */, 10 /* Constants.Slot */);
             }
             else if (value === Fragment) {
-                output(3 /* TypeIds.Constant */, 10 /* Constants.Fragment */);
+                output(3 /* TypeIds.Constant */, 11 /* Constants.Fragment */);
             }
             else if (isQrl(value)) {
-                if (!outputRootRef(value)) {
+                if (!outputAsRootRef(value)) {
                     const qrl = qrlToString(serializationContext, value);
                     const type = preloadQrls.has(value) ? 21 /* TypeIds.PreloadQRL */ : 20 /* TypeIds.QRL */;
                     if (isRootObject()) {
@@ -9002,19 +9114,19 @@ async function serialize(serializationContext) {
         }
         else if (typeof value === 'number') {
             if (Number.isNaN(value)) {
-                output(3 /* TypeIds.Constant */, 11 /* Constants.NaN */);
+                output(3 /* TypeIds.Constant */, 12 /* Constants.NaN */);
             }
             else if (!Number.isFinite(value)) {
-                output(3 /* TypeIds.Constant */, value < 0 ? 13 /* Constants.NegativeInfinity */ : 12 /* Constants.PositiveInfinity */);
+                output(3 /* TypeIds.Constant */, value < 0 ? 14 /* Constants.NegativeInfinity */ : 13 /* Constants.PositiveInfinity */);
             }
             else if (value === Number.MAX_SAFE_INTEGER) {
-                output(3 /* TypeIds.Constant */, 14 /* Constants.MaxSafeInt */);
+                output(3 /* TypeIds.Constant */, 15 /* Constants.MaxSafeInt */);
             }
             else if (value === Number.MAX_SAFE_INTEGER - 1) {
-                output(3 /* TypeIds.Constant */, 15 /* Constants.AlmostMaxSafeInt */);
+                output(3 /* TypeIds.Constant */, 16 /* Constants.AlmostMaxSafeInt */);
             }
             else if (value === Number.MIN_SAFE_INTEGER) {
-                output(3 /* TypeIds.Constant */, 16 /* Constants.MinSafeInt */);
+                output(3 /* TypeIds.Constant */, 17 /* Constants.MinSafeInt */);
             }
             else {
                 output(4 /* TypeIds.Number */, value);
@@ -9044,7 +9156,7 @@ async function serialize(serializationContext) {
                 output(3 /* TypeIds.Constant */, 4 /* Constants.EmptyString */);
             }
             else {
-                if (!outputRootRef(value)) {
+                if (!outputAsRootRef(value)) {
                     output(5 /* TypeIds.String */, value);
                 }
             }
@@ -9058,6 +9170,9 @@ async function serialize(serializationContext) {
         else if (value === STORE_ALL_PROPS) {
             output(3 /* TypeIds.Constant */, 8 /* Constants.STORE_ALL_PROPS */);
         }
+        else if (value === _UNINITIALIZED) {
+            output(3 /* TypeIds.Constant */, 9 /* Constants.UNINITIALIZED */);
+        }
         else {
             throw qError(20 /* QError.serializeErrorUnknownType */, [typeof value]);
         }
@@ -9067,14 +9182,11 @@ async function serialize(serializationContext) {
          * The object writer outputs an array object (without type prefix) and this increases the depth
          * for the objects within (depth 1).
          */
-        // Objects are the only way to create circular dependencies.
-        // So the first thing to to is to see if we have a circular dependency.
-        // (NOTE: For root objects we need to serialize them regardless if we have seen
-        //        them before, otherwise the root object reference will point to itself.)
-        // Also note that depth will be 1 for objects in root
-        if (outputRootRef(value, 1)) {
+        if (outputAsRootRef(value, 1)) {
             return;
         }
+        // handle custom serializers
+        // add to the seen map
         if (isPropsProxy(value)) {
             const varProps = value[_VAR_PROPS];
             const constProps = value[_CONST_PROPS];
@@ -9086,7 +9198,7 @@ async function serialize(serializationContext) {
             output(34 /* TypeIds.PropsProxy */, out);
         }
         else if (value instanceof SubscriptionData) {
-            output(35 /* TypeIds.EffectData */, [value.data.$scopedStyleIdPrefix$, value.data.$isConst$]);
+            output(35 /* TypeIds.SubscriptionData */, [value.data.$scopedStyleIdPrefix$, value.data.$isConst$]);
         }
         else if (isStore(value)) {
             if (isResource(value)) {
@@ -9162,14 +9274,6 @@ async function serialize(serializationContext) {
                 output(1 /* TypeIds.ForwardRef */, forwardRefId);
                 return;
             }
-            /**
-             * Special case: when a Signal value is an SSRNode, it always needs to be a DOM ref instead.
-             * It can never be meant to become a vNode, because vNodes are internal only.
-             */
-            const v = value instanceof ComputedSignalImpl &&
-                (value.$flags$ & 1 /* SignalFlags.INVALID */ || fastSkipSerialize(value.$untrackedValue$))
-                ? NEEDS_COMPUTATION
-                : value.$untrackedValue$;
             if (value instanceof WrappedSignalImpl) {
                 output(26 /* TypeIds.WrappedSignal */, [
                     ...serializeWrappingFn(serializationContext, value),
@@ -9179,35 +9283,34 @@ async function serialize(serializationContext) {
                     ...(value.$effects$ || []),
                 ]);
             }
-            else if (value instanceof AsyncComputedSignalImpl) {
-                addPreloadQrl(value.$computeQrl$);
-                const out = [
-                    value.$computeQrl$,
-                    value.$effects$,
-                    value.$loadingEffects$,
-                    value.$errorEffects$,
-                    value.$untrackedLoading$,
-                    value.$untrackedError$,
-                ];
-                if (v !== NEEDS_COMPUTATION) {
-                    out.push(v);
-                }
-                output(28 /* TypeIds.AsyncComputedSignal */, out);
-            }
             else if (value instanceof ComputedSignalImpl) {
+                let v = value.$untrackedValue$;
+                const shouldAlwaysSerialize = value.$flags$ & 16 /* ComputedSignalFlags.SERIALIZATION_STRATEGY_ALWAYS */;
+                const shouldNeverSerialize = value.$flags$ & 8 /* ComputedSignalFlags.SERIALIZATION_STRATEGY_NEVER */;
+                const isInvalid = value.$flags$ & 1 /* SignalFlags.INVALID */;
+                const isSkippable = fastSkipSerialize(value.$untrackedValue$);
+                if (shouldAlwaysSerialize) {
+                    v = value.$untrackedValue$;
+                }
+                else if (shouldNeverSerialize) {
+                    v = NEEDS_COMPUTATION;
+                }
+                else if (isInvalid || isSkippable) {
+                    v = NEEDS_COMPUTATION;
+                }
                 addPreloadQrl(value.$computeQrl$);
-                const out = [
-                    value.$computeQrl$,
-                    // TODO check if we can use domVRef for effects
-                    value.$effects$,
-                ];
+                const out = [value.$computeQrl$, value.$effects$];
+                const isAsync = value instanceof AsyncComputedSignalImpl;
+                if (isAsync) {
+                    out.push(value.$loadingEffects$, value.$errorEffects$, value.$untrackedLoading$, value.$untrackedError$);
+                }
                 if (v !== NEEDS_COMPUTATION) {
                     out.push(v);
                 }
-                output(27 /* TypeIds.ComputedSignal */, out);
+                output(isAsync ? 28 /* TypeIds.AsyncComputedSignal */ : 27 /* TypeIds.ComputedSignal */, out);
             }
             else {
-                output(25 /* TypeIds.Signal */, [v, ...(value.$effects$ || [])]);
+                output(25 /* TypeIds.Signal */, [value.$untrackedValue$, ...(value.$effects$ || [])]);
             }
         }
         else if (value instanceof URL) {
@@ -9342,6 +9445,12 @@ async function serialize(serializationContext) {
             const out = btoa(buf).replace(/=+$/, '');
             output(19 /* TypeIds.Uint8Array */, out);
         }
+        else if (value instanceof SerializationWeakRef) {
+            const forwardRefId = forwardRefsId++;
+            s11nWeakRefs.set(value.$obj$, forwardRefId);
+            forwardRefs[forwardRefId] = -1;
+            output(1 /* TypeIds.ForwardRef */, forwardRefId);
+        }
         else if (vnode_isVNode(value)) {
             output(3 /* TypeIds.Constant */, 0 /* Constants.Undefined */);
         }
@@ -9365,21 +9474,20 @@ async function serialize(serializationContext) {
     }
     const outputRoots = async () => {
         $writer$.write('[');
-        let lastRootsLength = 0;
         let rootsLength = serializationContext.$roots$.length;
-        while (lastRootsLength < rootsLength || promises.size) {
-            if (lastRootsLength !== 0) {
+        while (rootIdx < rootsLength || promises.size) {
+            if (rootIdx !== 0) {
                 $writer$.write(',');
             }
             let separator = false;
-            for (let i = lastRootsLength; i < rootsLength; i++) {
+            for (; rootIdx < rootsLength; rootIdx++) {
                 if (separator) {
                     $writer$.write(',');
                 }
                 else {
                     separator = true;
                 }
-                writeValue(serializationContext.$roots$[i]);
+                writeValue(serializationContext.$roots$[rootIdx]);
             }
             if (promises.size) {
                 try {
@@ -9389,7 +9497,6 @@ async function serialize(serializationContext) {
                     // ignore rejections, they will be serialized as rejected promises
                 }
             }
-            lastRootsLength = rootsLength;
             rootsLength = serializationContext.$roots$.length;
         }
         if (forwardRefs.length) {
@@ -9695,7 +9802,7 @@ function shouldTrackObj(obj) {
     return (
     // THINK: Not sure if we need to keep track of functions (QRLs) Let's skip them for now.
     // and see if we have a test case which requires them.
-    (typeof obj === 'object' && obj !== null) ||
+    isObject(obj) ||
         /**
          * We track all strings greater than 1 character, because those take at least 6 bytes to encode
          * and even with 999 root objects it saves one byte per reference. Tracking more objects makes
@@ -9723,9 +9830,7 @@ function isResource(value) {
     return '__brand' in value && value.__brand === 'resource';
 }
 const frameworkType = (obj) => {
-    return ((typeof obj === 'object' &&
-        obj !== null &&
-        (obj instanceof SignalImpl || obj instanceof Task || isJSXNode(obj))) ||
+    return ((isObject(obj) && (obj instanceof SignalImpl || obj instanceof Task || isJSXNode(obj))) ||
         isQrl(obj));
 };
 const canSerialize = (value, seen = new WeakSet()) => {
@@ -9811,6 +9916,9 @@ const canSerialize = (value, seen = new WeakSet()) => {
             return true;
         }
     }
+    else if (value === _UNINITIALIZED) {
+        return true;
+    }
     return false;
 };
 const QRL_RUNTIME_CHUNK = 'mock-chunk';
@@ -9850,12 +9958,12 @@ const _typeIdNames = [
     'FormData',
     'JSXNode',
     'PropsProxy',
-    'EffectData',
+    'SubscriptionData',
 ];
 const circularProofJson = (obj, indent) => {
     const seen = new WeakSet();
-    return JSON.stringify(obj, (key, value) => {
-        if (typeof value === 'object' && value !== null) {
+    return JSON.stringify(obj, (_, value) => {
+        if (isObject(value)) {
             if (seen.has(value)) {
                 return `[Circular ${value.constructor.name}]`;
             }
@@ -9892,7 +10000,7 @@ const dumpState = (state, color = false, prefix = '', limit = 20) => {
         let value = state[++i];
         if (key === undefined) {
             hasRaw = true;
-            out.push(`${RED}[raw${typeof value === 'object' && value ? ` ${value.constructor.name}` : ''}]${RESET} ${printRaw(value, `${prefix}  `)}`);
+            out.push(`${RED}[raw${isObject(value) ? ` ${value.constructor.name}` : ''}]${RESET} ${printRaw(value, `${prefix}  `)}`);
         }
         else {
             if (key === 3 /* TypeIds.Constant */) {
@@ -10006,7 +10114,6 @@ const _verifySerializable = (value, seen, ctx, preMessage) => {
     return value;
 };
 const noSerializeSet = /*#__PURE__*/ new WeakSet();
-const weakSerializeSet = /*#__PURE__*/ new WeakSet();
 const shouldSerialize = (obj) => {
     if (isObject(obj) || isFunction(obj)) {
         return !noSerializeSet.has(obj);
@@ -10015,7 +10122,7 @@ const shouldSerialize = (obj) => {
 };
 const fastSkipSerialize = (obj) => {
     return (obj &&
-        (typeof obj === 'object' || typeof obj === 'function') &&
+        (isObject(obj) || typeof obj === 'function') &&
         (NoSerializeSymbol in obj || noSerializeSet.has(obj)));
 };
 // <docs markdown="../../readme.md#noSerialize">
@@ -10040,16 +10147,11 @@ const fastSkipSerialize = (obj) => {
 // </docs>
 const noSerialize = (input) => {
     // only add supported values to the noSerializeSet, prevent console errors
-    if ((typeof input === 'object' && input !== null) || typeof input === 'function') {
+    if ((isObject(input) && input !== null) || typeof input === 'function') {
         noSerializeSet.add(input);
     }
     return input;
 };
-/** @internal */
-const _weakSerialize = (input) => {
-    weakSerializeSet.add(input);
-    return input;
-};
 /**
  * If an object has this property, it will not be serialized. Use this on prototypes to avoid having
  * to call `noSerialize()` on every object.
@@ -10076,6 +10178,7 @@ const NoSerializeSymbol = Symbol('noSerialize');
 const SerializerSymbol = Symbol('serialize');
 
 // keep these imports above the rest to prevent circular dep issues
+const resolvedSymbol = Symbol('resolved');
 const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef) => {
     if (qDev && qSerialize) {
         if (captureRef) {
@@ -10128,9 +10231,6 @@ const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef) => {
         };
         return bound;
     }
-    const resolveLazy = (containerEl) => {
-        return symbolRef !== null ? symbolRef : resolve(containerEl);
-    };
     // Wrap functions to provide their lexical scope
     const wrapFn = (fn) => {
         if (typeof fn !== 'function' || (!capture?.length && !captureRef?.length)) {
@@ -10159,45 +10259,58 @@ const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef) => {
             return invoke.call(this, context, fn, ...args);
         };
     };
-    const resolve = async (containerEl) => {
-        if (symbolRef !== null) {
-            // Resolving (Promise) or already resolved (value)
+    // Retrieve memoized result from symbolFn
+    if (symbolFn && resolvedSymbol in symbolFn) {
+        symbolRef = symbolFn[resolvedSymbol];
+    }
+    const resolve = symbolRef
+        ? async () => symbolRef
+        : async (containerEl) => {
+            if (symbolRef !== null) {
+                // Resolving (Promise) or already resolved (value)
+                return symbolRef;
+            }
+            if (containerEl) {
+                setContainer(containerEl);
+            }
+            if (chunk === '') {
+                // Sync QRL
+                assertDefined(_containerEl, 'Sync QRL must have container element');
+                const hash = _containerEl.getAttribute(QInstanceAttr);
+                const doc = _containerEl.ownerDocument;
+                const qFuncs = getQFuncs(doc, hash);
+                // No need to wrap, syncQRLs can't have captured scope
+                return (qrl.resolved = symbolRef = qFuncs[Number(symbol)]);
+            }
+            if (isBrowser && chunk) {
+                /** We run the QRL, so now the probability of the chunk is 100% */
+                p(chunk, 1);
+            }
+            const start = now();
+            const ctx = tryGetInvokeContext();
+            if (symbolFn !== null) {
+                symbolRef = symbolFn().then((module) => {
+                    const resolved = wrapFn((symbolRef = module[symbol]));
+                    // We memoize the result on the symbolFn
+                    symbolFn[resolvedSymbol] = resolved;
+                    qrl.resolved = resolved;
+                    return resolved;
+                });
+            }
+            else {
+                // TODO cache the imported symbol but watch out for dev mode
+                const imported = getPlatform().importSymbol(_containerEl, chunk, symbol);
+                symbolRef = maybeThen(imported, (ref) => (qrl.resolved = wrapFn((symbolRef = ref))));
+            }
+            if (isPromise(symbolRef)) {
+                symbolRef.then(() => emitUsedSymbol(symbol, ctx?.$element$, start), (err) => {
+                    console.error(`qrl ${symbol} failed to load`, err);
+                    // We shouldn't cache rejections, we can try again later
+                    symbolRef = null;
+                });
+            }
             return symbolRef;
-        }
-        if (containerEl) {
-            setContainer(containerEl);
-        }
-        if (chunk === '') {
-            // Sync QRL
-            assertDefined(_containerEl, 'Sync QRL must have container element');
-            const hash = _containerEl.getAttribute(QInstanceAttr);
-            const doc = _containerEl.ownerDocument;
-            const qFuncs = getQFuncs(doc, hash);
-            // No need to wrap, syncQRLs can't have captured scope
-            return (qrl.resolved = symbolRef = qFuncs[Number(symbol)]);
-        }
-        if (isBrowser && chunk) {
-            /** We run the QRL, so now the probability of the chunk is 100% */
-            p(chunk, 1);
-        }
-        const start = now();
-        const ctx = tryGetInvokeContext();
-        if (symbolFn !== null) {
-            symbolRef = symbolFn().then((module) => (qrl.resolved = wrapFn((symbolRef = module[symbol]))));
-        }
-        else {
-            const imported = getPlatform().importSymbol(_containerEl, chunk, symbol);
-            symbolRef = maybeThen(imported, (ref) => (qrl.resolved = wrapFn((symbolRef = ref))));
-        }
-        if (typeof symbolRef === 'object' && isPromise(symbolRef)) {
-            symbolRef.then(() => emitUsedSymbol(symbol, ctx?.$element$, start), (err) => {
-                console.error(`qrl ${symbol} failed to load`, err);
-                // We shouldn't cache rejections, we can try again later
-                symbolRef = null;
-            });
-        }
-        return symbolRef;
-    };
+        };
     const createOrReuseInvocationContext = (invoke) => {
         if (invoke == null) {
             return newInvokeContext();
@@ -10215,7 +10328,6 @@ const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef) => {
         getHash: () => hash,
         getCaptured: () => captureRef,
         resolve,
-        $resolveLazy$: resolveLazy,
         $setContainer$: setContainer,
         $chunk$: chunk,
         $symbol$: symbol,
@@ -11056,13 +11168,13 @@ const _useStyles = (styleQrl, transform, scoped) => {
     const styleId = styleKey(styleQrl, i);
     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;
 };
@@ -11243,13 +11355,13 @@ const useConstant = (value) => {
     return set(value);
 };
 
-const useComputedCommon = (qrl, Class) => {
+const useComputedCommon = (qrl, createFn, options) => {
     const { val, set } = useSequentialScope();
     if (val) {
         return val;
     }
     assertQrl(qrl);
-    const signal = new Class(null, qrl);
+    const signal = createFn(qrl, options);
     set(signal);
     // Note that we first save the signal
     // and then we throw to load the qrl
@@ -11258,8 +11370,8 @@ const useComputedCommon = (qrl, Class) => {
     return signal;
 };
 /** @internal */
-const useComputedQrl = (qrl) => {
-    return useComputedCommon(qrl, ComputedSignalImpl);
+const useComputedQrl = (qrl, options) => {
+    return useComputedCommon(qrl, createComputedSignal, options);
 };
 /**
  * Creates a computed signal which is calculated from the given function. A computed signal is a
@@ -11274,7 +11386,7 @@ const useComputedQrl = (qrl) => {
 const useComputed$ = implicit$FirstArg(useComputedQrl);
 
 /** @internal */
-const useSerializerQrl = (qrl) => useComputedCommon(qrl, SerializerSignalImpl);
+const useSerializerQrl = (qrl) => useComputedCommon(qrl, createSerializerSignal);
 /**
  * Creates a signal which holds a custom serializable value. It requires that the value implements
  * the `CustomSerializable` type, which means having a function under the `[SerializeSymbol]`
@@ -11353,7 +11465,7 @@ const useVisibleTaskQrl = (qrl, opts) => {
     set(task);
     useRunTask(task, eagerness);
     if (!isServerPlatform()) {
-        qrl.$resolveLazy$(iCtx.$element$);
+        qrl.resolve(iCtx.$element$);
         iCtx.$container$.$scheduler$(32 /* ChoreType.VISIBLE */, task);
     }
 };
@@ -11529,8 +11641,8 @@ const useTask$ = /*#__PURE__*/ implicit$FirstArg(useTaskQrl);
 const useVisibleTask$ = /*#__PURE__*/ implicit$FirstArg(useVisibleTaskQrl);
 
 /** @internal */
-const useAsyncComputedQrl = (qrl) => {
-    return useComputedCommon(qrl, AsyncComputedSignalImpl);
+const useAsyncComputedQrl = (qrl, options) => {
+    return useComputedCommon(qrl, createAsyncComputedSignal, options);
 };
 /**
  * Creates a computed signal which is calculated from the given function. A computed signal is a
@@ -11621,5 +11733,5 @@ const PREFETCH_CODE = /*#__PURE__*/ ((c // Service worker container
  */
 const PrefetchGraph = (_opts = {}) => null;
 
-export { $, Fragment, NoSerializeSymbol, PrefetchGraph, PrefetchServiceWorker, RenderOnce, Resource, SSRComment, SSRRaw, SSRStream, SSRStreamBlock, SerializerSymbol, SkipRender, Slot, _CONST_PROPS, DomContainer as _DomContainer, _EFFECT_BACK_REF, EMPTY_ARRAY as _EMPTY_ARRAY, _IMMUTABLE, _SharedContainer, SubscriptionData as _SubscriptionData, _VAR_PROPS, _deserialize, dumpState as _dumpState, _fnSignal, _getContextElement, _getContextEvent, getDomContainer as _getDomContainer, _getQContainerElement, isJSXNode as _isJSXNode, isStringifiable as _isStringifiable, _jsxBranch, _jsxC, _jsxQ, _jsxS, _jsxSorted, _jsxSplit, _noopQrl, _noopQrlDEV, preprocessState as _preprocessState, _qrlSync, _regSymbol, _restProps, queueQRL as _run, _serialize, scheduleTask as _task, verifySerializable as _verifySerializable, vnode_toString as _vnode_toString, _waitUntilRendered, _walkJSX, _weakSerialize, _wrapProp, _wrapSignal, _wrapStore, component$, componentQrl, createComputed$, createComputedSignal as createComputedQrl, createContextId, h as createElement, createSerializer$, createSerializerSignal as createSerializerQrl, createSignal, event$, eventQrl, getDomContainer, getLocale, getPlatform, h, implicit$FirstArg, inlinedQrl, inlinedQrlDEV, isSignal, jsx, jsxDEV, jsx as jsxs, noSerialize, qrl, qrlDEV, render, setPlatform, sync$, untrack, unwrapStore, useAsyncComputed$, useAsyncComputedQrl, useComputed$, useComputedQrl, useConstant, useContext, useContextProvider, useErrorBoundary, useId, useLexicalScope, useOn, useOnDocument, useOnWindow, useResource$, useResourceQrl, useSerializer$, useSerializerQrl, useServerData, useSignal, useStore, useStyles$, useStylesQrl, useStylesScoped$, useStylesScopedQrl, useTask$, useTaskQrl, useVisibleTask$, useVisibleTaskQrl, version, withLocale };
+export { $, Fragment, NoSerializeSymbol, PrefetchGraph, PrefetchServiceWorker, RenderOnce, Resource, SSRComment, SSRRaw, SSRStream, SSRStreamBlock, SerializerSymbol, SkipRender, Slot, _CONST_PROPS, DomContainer as _DomContainer, _EFFECT_BACK_REF, EMPTY_ARRAY as _EMPTY_ARRAY, _IMMUTABLE, _SharedContainer, SubscriptionData as _SubscriptionData, _UNINITIALIZED, _VAR_PROPS, _deserialize, dumpState as _dumpState, _fnSignal, _getContextContainer, _getContextElement, _getContextEvent, getDomContainer as _getDomContainer, _getQContainerElement, isJSXNode as _isJSXNode, isStringifiable as _isStringifiable, _jsxBranch, _jsxC, _jsxQ, _jsxS, _jsxSorted, _jsxSplit, _noopQrl, _noopQrlDEV, preprocessState as _preprocessState, _qrlSync, _regSymbol, _restProps, queueQRL as _run, _serializationWeakRef, _serialize, scheduleTask as _task, useInvokeContext as _useInvokeContext, verifySerializable as _verifySerializable, vnode_toString as _vnode_toString, _waitUntilRendered, _walkJSX, _wrapProp, _wrapSignal, component$, componentQrl, createAsyncComputed$, createAsyncComputedSignal as createAsyncComputedQrl, createComputed$, createComputedSignal as createComputedQrl, createContextId, h as createElement, createSerializer$, createSerializerSignal as createSerializerQrl, createSignal, event$, eventQrl, getDomContainer, getLocale, getPlatform, h, implicit$FirstArg, inlinedQrl, inlinedQrlDEV, isSignal, jsx, jsxDEV, jsx as jsxs, noSerialize, qrl, qrlDEV, render, setPlatform, sync$, untrack, unwrapStore, useAsyncComputed$, useAsyncComputedQrl, useComputed$, useComputedQrl, useConstant, useContext, useContextProvider, useErrorBoundary, useId, useLexicalScope, useOn, useOnDocument, useOnWindow, useResource$, useResourceQrl, useSerializer$, useSerializerQrl, useServerData, useSignal, useStore, useStyles$, useStylesQrl, useStylesScoped$, useStylesScopedQrl, useTask$, useTaskQrl, useVisibleTask$, useVisibleTaskQrl, version, withLocale };
 //# sourceMappingURL=core.mjs.map