@qwik.dev/core 2.0.0-beta.14 → 2.0.0-beta.15

package/dist/core.prod.mjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core 2.0.0-beta.14-dev+1e7496d
+ * @qwik.dev/core 2.0.0-beta.15-dev+920f1a4
  * 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
@@ -11,7 +11,7 @@ export { isBrowser, isDev, isServer } from "@qwik.dev/core/build";
 
 import { p } from "@qwik.dev/core/preloader";
 
-const version = "2.0.0-beta.14-dev+1e7496d";
+const version = "2.0.0-beta.15-dev+920f1a4";
 
 const qDev = !1;
 
@@ -178,8 +178,6 @@ const ELEMENT_SEQ = "q:seq";
 
 const ELEMENT_SEQ_IDX = "q:seqIdx";
 
-const Q_PREFIX = "q:";
-
 const NON_SERIALIZABLE_MARKER_PREFIX = ":";
 
 const USE_ON_LOCAL = ":on";
@@ -608,14 +606,14 @@ const STORE_ALL_PROPS = Symbol("store.all");
 
 class SignalImpl {
     $untrackedValue$;
-    $effects$=null;
+    $effects$=void 0;
     $container$=null;
     $wrappedSignal$=null;
     constructor(container, value) {
         this.$container$ = container, this.$untrackedValue$ = value;
     }
     force() {
-        this.$container$?.$scheduler$(7, null, this, this.$effects$);
+        this.$container$?.$scheduler$(7, void 0, this, this.$effects$);
     }
     get untrackedValue() {
         return this.$untrackedValue$;
@@ -627,7 +625,7 @@ class SignalImpl {
         return setupSignalValueAccess(this, () => this.$effects$ ||= new Set, () => this.untrackedValue);
     }
     set value(value) {
-        value !== this.$untrackedValue$ && (this.$untrackedValue$ = value, this.$container$?.$scheduler$(7, null, this, this.$effects$));
+        value !== this.$untrackedValue$ && (this.$untrackedValue$ = value, this.$container$?.$scheduler$(7, void 0, this, this.$effects$));
     }
     valueOf() {
         qDev;
@@ -670,6 +668,8 @@ const _VAR_PROPS = Symbol("VAR");
 
 const _OWNER = Symbol("OWNER");
 
+const _PROPS_HANDLER = Symbol("PROPS_HANDLER");
+
 const _IMMUTABLE = Symbol("IMMUTABLE");
 
 const _UNINITIALIZED = Symbol("UNINITIALIZED");
@@ -709,6 +709,13 @@ const fromCamelToKebabCase = text => text.replace(/([A-Z-])/g, a => "-" + a.toLo
 
 const getEventDataFromHtmlAttribute = htmlKey => htmlKey.startsWith("on:") ? [ "", htmlKey.substring(3) ] : htmlKey.startsWith("on-window:") ? [ "window", htmlKey.substring(10) ] : [ "document", htmlKey.substring(12) ];
 
+const getScopedEventName = (scope, eventName) => {
+    const suffix = ":" + eventName;
+    return scope ? scope + suffix : suffix;
+};
+
+const getLoaderScopedEventName = (scope, scopedEvent) => scope ? "-" + scopedEvent : scopedEvent;
+
 const EMPTY_ARRAY = [];
 
 const EMPTY_OBJ = {};
@@ -721,6 +728,8 @@ Object.freeze(EMPTY_ARRAY), Object.freeze(EMPTY_OBJ);
 
 class PropsProxyHandler {
     owner;
+    $effects$=void 0;
+    $container$=null;
     constructor(owner) {
         this.owner = owner;
     }
@@ -734,6 +743,9 @@ class PropsProxyHandler {
         if (prop === _OWNER) {
             return this.owner;
         }
+        if (prop === _PROPS_HANDLER) {
+            return this;
+        }
         let value;
         if ("children" === prop) {
             value = this.owner.children;
@@ -742,7 +754,7 @@ class PropsProxyHandler {
                 const attr = jsxEventToHtmlAttribute(prop);
                 attr && (prop = attr);
             }
-            value = directGetPropsProxyProp(this.owner, prop);
+            value = directGetPropsProxyProp(this.owner, prop), prop in this.owner.varProps && addPropsProxyEffect(this, prop);
         }
         return value instanceof WrappedSignalImpl && 4 & value.$flags$ ? value.value : value;
     }
@@ -751,6 +763,10 @@ class PropsProxyHandler {
             this.owner = value;
         } else if ("children" === prop) {
             this.owner.children = value;
+        } else if (prop === _CONST_PROPS) {
+            this.owner.constProps = value;
+        } else if (prop === _VAR_PROPS) {
+            this.owner.varProps = value;
         } else {
             if ("string" == typeof prop && "string" == typeof this.owner.type) {
                 const attr = jsxEventToHtmlAttribute(prop);
@@ -758,13 +774,13 @@ class PropsProxyHandler {
             }
             this.owner.constProps && prop in this.owner.constProps && delete this.owner.constProps[prop], 
             this.owner.varProps === EMPTY_OBJ ? this.owner.varProps = {} : prop in this.owner.varProps || (this.owner.toSort = !0), 
-            this.owner.varProps[prop] = value;
+            this.owner.varProps[prop] !== value && (this.owner.varProps[prop] = value, triggerPropsProxyEffect(this, prop));
         }
         return !0;
     }
     deleteProperty(_, prop) {
         let didDelete = delete this.owner.varProps[prop];
-        return this.owner.constProps && (didDelete = delete this.owner.constProps[prop] || didDelete), 
+        return didDelete && triggerPropsProxyEffect(this, prop), this.owner.constProps && (didDelete = delete this.owner.constProps[prop] || didDelete), 
         null != this.owner.children && "children" === prop && (this.owner.children = null, 
         didDelete = !0), didDelete;
     }
@@ -775,11 +791,12 @@ class PropsProxyHandler {
         if (prop === _CONST_PROPS || prop === _VAR_PROPS) {
             return !0;
         }
-        if ("string" == typeof prop && "string" == typeof this.owner.type) {
+        const inVarProps = prop in this.owner.varProps;
+        if ("string" == typeof prop && (inVarProps && addPropsProxyEffect(this, prop), "string" == typeof this.owner.type)) {
             const attr = jsxEventToHtmlAttribute(prop);
             attr && (prop = attr);
         }
-        return prop in this.owner.varProps || !!this.owner.constProps && prop in this.owner.constProps;
+        return inVarProps || !!this.owner.constProps && prop in this.owner.constProps;
     }
     getOwnPropertyDescriptor(_, p) {
         return {
@@ -799,6 +816,22 @@ class PropsProxyHandler {
     }
 }
 
+const addPropsProxyEffect = (propsProxy, prop) => {
+    const ctx = tryGetInvokeContext();
+    ctx && (null === propsProxy.$container$ ? ctx.$container$ && (propsProxy.$container$ = ctx.$container$) : assertTrue(!ctx.$container$ || ctx.$container$ === propsProxy.$container$, "Do not use props across containers"));
+    const effectSubscriber = ctx?.$effectSubscriber$;
+    effectSubscriber && addStoreEffect(propsProxy.owner._proxy, prop, propsProxy, effectSubscriber);
+};
+
+const triggerPropsProxyEffect = (propsProxy, prop) => {
+    const effects = getEffects$1(propsProxy.$effects$, prop);
+    effects && propsProxy.$container$?.$scheduler$(7, void 0, propsProxy, effects);
+};
+
+function getEffects$1(effects, prop) {
+    return effects?.get(prop);
+}
+
 const directGetPropsProxyProp = (jsx, prop) => jsx.constProps && prop in jsx.constProps ? jsx.constProps[prop] : jsx.varProps[prop];
 
 const _getVarProps = props => props ? _VAR_PROPS in props ? "children" in props ? {
@@ -878,12 +911,12 @@ const log = (...args) => console.log("COMPUTED SIGNAL", ...args.map(qwikDebugToS
 class ComputedSignalImpl extends SignalImpl {
     $computeQrl$;
     $flags$;
-    [_EFFECT_BACK_REF]=null;
+    [_EFFECT_BACK_REF]=void 0;
     constructor(container, fn, flags = 33) {
         super(container, NEEDS_COMPUTATION), this.$computeQrl$ = fn, this.$flags$ = flags;
     }
     invalidate() {
-        this.$flags$ |= 1, this.$container$?.$scheduler$(7, null, this, this.$effects$);
+        this.$flags$ |= 1, this.$container$?.$scheduler$(7, void 0, this, this.$effects$);
     }
     force() {
         this.$flags$ |= 2, super.force();
@@ -923,13 +956,13 @@ class ComputedSignalImpl extends SignalImpl {
 
 class AsyncComputedSignalImpl extends ComputedSignalImpl {
     $untrackedLoading$=!1;
-    $untrackedError$=null;
-    $loadingEffects$=null;
-    $errorEffects$=null;
+    $untrackedError$=void 0;
+    $loadingEffects$=void 0;
+    $errorEffects$=void 0;
     $destroy$;
     $promiseValue$=NEEDS_COMPUTATION;
     $promise$=null;
-    [_EFFECT_BACK_REF]=null;
+    [_EFFECT_BACK_REF]=void 0;
     constructor(container, fn, flags = 1) {
         super(container, fn, flags);
     }
@@ -937,7 +970,7 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
         return setupSignalValueAccess(this, () => this.$loadingEffects$ ||= new Set, () => this.untrackedLoading);
     }
     set untrackedLoading(value) {
-        value !== this.$untrackedLoading$ && (this.$untrackedLoading$ = value, this.$container$?.$scheduler$(7, null, this, this.$loadingEffects$));
+        value !== this.$untrackedLoading$ && (this.$untrackedLoading$ = value, this.$container$?.$scheduler$(7, void 0, this, this.$loadingEffects$));
     }
     get untrackedLoading() {
         return this.$untrackedLoading$;
@@ -946,7 +979,7 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
         return setupSignalValueAccess(this, () => this.$errorEffects$ ||= new Set, () => this.untrackedError);
     }
     set untrackedError(value) {
-        value !== this.$untrackedError$ && (this.$untrackedError$ = value, this.$container$?.$scheduler$(7, null, this, this.$errorEffects$));
+        value !== this.$untrackedError$ && (this.$untrackedError$ = value, this.$container$?.$scheduler$(7, void 0, this, this.$errorEffects$));
     }
     get untrackedError() {
         return this.$untrackedError$;
@@ -965,9 +998,9 @@ class AsyncComputedSignalImpl extends ComputedSignalImpl {
         const untrackedValue = this.$promiseValue$ === NEEDS_COMPUTATION || null === this.$promise$ ? this.$promiseComputation$() : this.$promiseValue$;
         if (isPromise(untrackedValue)) {
             const isFirstComputation = this.$promiseValue$ === NEEDS_COMPUTATION;
-            this.untrackedLoading = !0, this.untrackedError = null, this.$promiseValue$ !== NEEDS_COMPUTATION && cleanupDestroyable(this);
+            this.untrackedLoading = !0, this.untrackedError = void 0, this.$promiseValue$ !== NEEDS_COMPUTATION && cleanupDestroyable(this);
             const promise = untrackedValue.then(promiseValue => {
-                this.$promiseValue$ = promiseValue, this.untrackedLoading = !1, this.untrackedError = null, 
+                this.$promiseValue$ = promiseValue, this.untrackedLoading = !1, this.untrackedError = void 0, 
                 this.setValue(promiseValue) && scheduleEffects(this.$container$, this, this.$effects$);
             }).catch(err => {
                 isPromise(err) || (this.$promiseValue$ = err, this.untrackedLoading = !1, this.untrackedError = err);
@@ -1056,19 +1089,24 @@ const _wrapProp = (...args) => {
     }
     if (isPropsProxy(obj)) {
         const constProps = obj[_CONST_PROPS];
+        const varProps = obj[_VAR_PROPS];
         if (constProps && prop in constProps) {
             return constProps[prop];
         }
+        if (prop in varProps) {
+            return wrapIfNotSignal(varProps[prop], args);
+        }
     } else {
         const target = getStoreTarget(obj);
         if (target) {
-            const value = target[prop];
-            return isSignal(value) ? value : getWrapped(args);
+            return wrapIfNotSignal(target[prop], args);
         }
     }
     return obj[prop];
 };
 
+const wrapIfNotSignal = (value, args) => isSignal(value) ? value : getWrapped(args);
+
 const _wrapSignal = (obj, prop) => {
     const r = _wrapProp(obj, prop);
     return r === _IMMUTABLE ? obj[prop] : r;
@@ -1079,8 +1117,8 @@ class WrappedSignalImpl extends SignalImpl {
     $func$;
     $funcStr$;
     $flags$;
-    $hostElement$=null;
-    [_EFFECT_BACK_REF]=null;
+    $hostElement$=void 0;
+    [_EFFECT_BACK_REF]=void 0;
     constructor(container, fn, args, fnStr, flags = 5) {
         super(container, NEEDS_COMPUTATION), this.$args$ = args, this.$func$ = fn, this.$funcStr$ = fnStr, 
         this.$flags$ = flags;
@@ -1121,7 +1159,7 @@ class WrappedSignalImpl extends SignalImpl {
 }
 
 let BackRef$1 = class {
-    [_EFFECT_BACK_REF]=null;
+    [_EFFECT_BACK_REF]=void 0;
 };
 
 function clearAllEffects(container, consumer) {
@@ -1131,6 +1169,7 @@ function clearAllEffects(container, consumer) {
         for (const [, effect] of effects) {
             clearEffectSubscription(container, effect);
         }
+        effects.clear();
     }
 }
 
@@ -1142,17 +1181,20 @@ function clearEffectSubscription(container, effect) {
                 clearSignal(container, producer, effect);
             } else if (producer instanceof AsyncComputedSignalImpl) {
                 clearAsyncComputedSignal(producer, effect);
+            } else if (isPropsProxy(producer)) {
+                clearStoreOrProps(producer[_PROPS_HANDLER], effect);
             } else if (container.$storeProxyMap$.has(producer)) {
                 const target = container.$storeProxyMap$.get(producer);
-                clearStore(getStoreHandler(target), effect);
+                clearStoreOrProps(getStoreHandler(target), effect);
             }
         }
+        backRefs.clear();
     }
 }
 
 function clearSignal(container, producer, effect) {
     const effects = producer.$effects$;
-    effects && effects.has(effect) && effects.delete(effect), producer instanceof WrappedSignalImpl && (producer.$hostElement$ = null, 
+    effects && effects.has(effect) && effects.delete(effect), producer instanceof WrappedSignalImpl && (producer.$hostElement$ = void 0, 
     clearAllEffects(container, producer));
 }
 
@@ -1163,11 +1205,11 @@ function clearAsyncComputedSignal(producer, effect) {
     pendingEffects && pendingEffects.has(effect) && pendingEffects.delete(effect);
 }
 
-function clearStore(producer, effect) {
+function clearStoreOrProps(producer, effect) {
     const effects = producer?.$effects$;
     if (effects) {
-        for (const [propKey, propEffects] of effects.entries()) {
-            propEffects.has(effect) && (propEffects.delete(effect), 0 === propEffects.size && effects.delete(propKey));
+        for (const [prop, propEffects] of effects.entries()) {
+            propEffects.has(effect) && (propEffects.delete(effect), 0 === propEffects.size && effects.delete(prop));
         }
     }
 }
@@ -1624,8 +1666,9 @@ const vnode_applyJournal = journal => {
             let key = journal[idx++];
             "className" === key && (key = "class");
             const value = journal[idx++];
-            isBooleanAttr(element, key) ? element[key] = parseBoolean(value) : "value" === key && key in element ? element.value = String(value) : key === dangerouslySetInnerHTML ? (element.innerHTML = value, 
-            element.setAttribute("q:container", "html")) : null == value || !1 === value ? element.removeAttribute(key) : element.setAttribute(key, String(value));
+            const shouldRemove = null == value || !1 === value;
+            isBooleanAttr(element, key) ? element[key] = parseBoolean(value) : key === dangerouslySetInnerHTML ? (element.innerHTML = value, 
+            element.setAttribute("q:container", "html")) : shouldRemove ? element.removeAttribute(key) : "value" === key && key in element ? element.value = String(value) : element.setAttribute(key, String(value));
             break;
 
           case 3:
@@ -2083,7 +2126,8 @@ function materializeFromVNodeData(vParent, vData, element, child) {
         const nodeIsElement = isElement(node);
         return !nodeIsElement || nodeIsElement && shouldSkipElement(node);
     };
-    return processVNodeData$1(vData, (peek, consumeValue, consume, getChar, nextToConsumeIdx) => {
+    let components = null;
+    if (processVNodeData$1(vData, (peek, consumeValue, consume, getChar, nextToConsumeIdx) => {
         if (isNumber(peek())) {
             for (;shouldSkipNode(child); ) {
                 if (!(child = fastNextSibling(child))) {
@@ -2101,7 +2145,7 @@ function materializeFromVNodeData(vParent, vData, element, child) {
         } else if (peek() === VNodeDataChar.SCOPED_STYLE) {
             vParent.setAttr("q:sstyle", consumeValue(), null);
         } else if (peek() === VNodeDataChar.RENDER_FN) {
-            vParent.setAttr("q:renderFn", consumeValue(), null);
+            (components ||= []).push(vParent), vParent.setAttr("q:renderFn", consumeValue(), null);
         } else if (peek() === VNodeDataChar.ID) {
             container || (container = getDomContainer(element));
             const id = consumeValue();
@@ -2149,7 +2193,14 @@ function materializeFromVNodeData(vParent, vData, element, child) {
             addVNode(previousTextNode = vnode_newSharedText(previousTextNode, textNode, text)), 
             textIdx += length;
         }
-    }), vParent.lastChild = vLast, vFirst;
+    }), components) {
+        container || (container = getDomContainer(element));
+        for (const component of components) {
+            container.ensureProjectionResolved(component);
+        }
+        components = null;
+    }
+    return vParent.lastChild = vLast, vFirst;
 }
 
 const vnode_getType = vnode => {
@@ -2494,8 +2545,8 @@ const _jsxSorted = (type, varProps, constProps, children, flags, key, dev) => un
 const _jsxSplit = (type, varProps, constProps, children, flags, key, dev) => untrack(() => {
     if (varProps) {
         for (const k in varProps) {
-            "children" === k ? (children ||= varProps.children, varProps.children = void 0) : "key" === k ? (key ||= varProps.key, 
-            varProps.key = void 0) : constProps && k in constProps && (varProps[k] = void 0);
+            "children" === k ? (children ||= varProps.children, delete varProps.children) : "key" === k ? (key ||= varProps.key, 
+            delete varProps.key) : constProps && k in constProps && delete varProps[k];
         }
     }
     return new JSXNodeImpl(type, varProps, constProps, children, key, !0, dev);
@@ -3324,8 +3375,8 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                         } else if (isSignal(jsxValue)) {
                             expectVirtual("S", null);
                             const unwrappedSignal = jsxValue instanceof WrappedSignalImpl ? jsxValue.$unwrapIfSignal$() : jsxValue;
-                            const currentSignal = vCurrent?.[_EFFECT_BACK_REF]?.get(".")?.[0];
-                            if (currentSignal !== unwrappedSignal) {
+                            const hasUnwrappedSignal = vCurrent?.[_EFFECT_BACK_REF]?.get(".")?.[2]?.has(unwrappedSignal);
+                            if (!hasUnwrappedSignal) {
                                 const vHost = vNewNode || vCurrent;
                                 descend(resolveSignalAndDescend(() => trackSignalAndAssignHost(unwrappedSignal, vHost, ".", container)), !0);
                             }
@@ -3488,10 +3539,11 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 if (isHtmlAttributeAnEventName(key)) {
                     const data = getEventDataFromHtmlAttribute(key);
                     if (data) {
-                        const scope = data[0];
-                        const eventName = data[1];
-                        eventName && (vNewNode.setProp(HANDLER_PREFIX + ":" + scope + ":" + eventName, value), 
-                        scope && vNewNode.setAttr(key, "", journal), registerQwikLoaderEvent(eventName));
+                        const [scope, eventName] = data;
+                        const scopedEvent = getScopedEventName(scope, eventName);
+                        const loaderScopedEvent = getLoaderScopedEventName(scope, scopedEvent);
+                        eventName && (vNewNode.setProp(HANDLER_PREFIX + ":" + scopedEvent, value), scope && vNewNode.setAttr(key, "", journal), 
+                        registerQwikLoaderEvent(loaderScopedEvent));
                     }
                     needsQDispatchEventPatch = !0;
                     continue;
@@ -3578,10 +3630,14 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             let srcIdx = 0;
             let dstIdx = 0;
             let patchEventDispatch = !1;
-            const setAttribute = (key, value, vHost) => {
-                vHost.setAttr(key, null !== value ? serializeAttribute(key, value, scopedStyleIdPrefix) : null, journal);
+            const setAttributeDirect = (vnode, key, value, dstIdx, isNewKey) => {
+                const serializedValue = null != value ? serializeAttribute(key, value, scopedStyleIdPrefix) : null;
+                isNewKey ? null != serializedValue && (dstAttrs.splice(dstIdx, 0, key, serializedValue), 
+                journal.push(2, vnode.element, key, serializedValue)) : null != serializedValue ? (dstAttrs[dstIdx + 1] = serializedValue, 
+                journal.push(2, vnode.element, key, serializedValue)) : (dstAttrs.splice(dstIdx, 2), 
+                journal.push(2, vnode.element, key, null));
             };
-            const record = (key, value) => {
+            const record = (key, value, dstIdx, isNewKey) => {
                 if (key.startsWith(":")) {
                     return void vnode.setProp(key, value);
                 }
@@ -3610,42 +3666,48 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 }
                 if (isPromise(value)) {
                     const vHost = vnode;
-                    const attributePromise = value.then(resolvedValue => setAttribute(key, resolvedValue, vHost));
+                    const attributePromise = value.then(resolvedValue => {
+                        const idx = mapApp_findIndx(dstAttrs, key, 0);
+                        const isNewKey = idx < 0;
+                        setAttributeDirect(vHost, key, resolvedValue, isNewKey ? -1 ^ idx : idx, isNewKey);
+                    });
                     return void asyncAttributePromises.push(attributePromise);
                 }
-                setAttribute(key, value, vnode);
+                setAttributeDirect(vnode, key, value, dstIdx, isNewKey);
             };
             const recordJsxEvent = (key, value) => {
                 const data = getEventDataFromHtmlAttribute(key);
                 if (data) {
                     const [scope, eventName] = data;
-                    record(":" + scope + ":" + eventName, value), registerQwikLoaderEvent(eventName), 
+                    const scopedEvent = getScopedEventName(scope, eventName);
+                    const loaderScopedEvent = getLoaderScopedEventName(scope, scopedEvent);
+                    record(":" + scopedEvent, value, 0, !1), registerQwikLoaderEvent(loaderScopedEvent), 
                     patchEventDispatch = !0;
                 }
             };
             for (;srcIdx < srcAttrs.length || dstIdx < dstAttrs.length; ) {
                 const srcKey = srcIdx < srcAttrs.length ? srcAttrs[srcIdx] : void 0;
                 const dstKey = dstIdx < dstAttrs.length ? dstAttrs[dstIdx] : void 0;
-                if (dstKey?.startsWith(HANDLER_PREFIX) || dstKey?.startsWith("q:")) {
+                if (dstKey?.startsWith(HANDLER_PREFIX)) {
                     dstIdx += 2;
                 } else if (void 0 === srcKey) {
-                    isHtmlAttributeAnEventName(dstKey) ? dstIdx += 2 : record(dstKey, null);
+                    isHtmlAttributeAnEventName(dstKey) ? dstIdx += 2 : record(dstKey, null, dstIdx, !1);
                 } else if (void 0 === dstKey) {
                     const srcValue = srcAttrs[srcIdx + 1];
-                    isHtmlAttributeAnEventName(srcKey) ? recordJsxEvent(srcKey, srcValue) : record(srcKey, srcValue), 
+                    isHtmlAttributeAnEventName(srcKey) ? recordJsxEvent(srcKey, srcValue) : record(srcKey, srcValue, dstIdx, !0), 
                     srcIdx += 2, dstIdx += 2;
                 } else if (srcKey === dstKey) {
                     const srcValue = srcAttrs[srcIdx + 1];
                     const dstValue = dstAttrs[dstIdx + 1];
                     const isEventHandler = isHtmlAttributeAnEventName(srcKey);
-                    srcValue !== dstValue ? isEventHandler ? recordJsxEvent(srcKey, srcValue) : record(srcKey, srcValue) : isEventHandler && !vnode.element.qDispatchEvent && recordJsxEvent(srcKey, srcValue), 
+                    srcValue !== dstValue ? isEventHandler ? recordJsxEvent(srcKey, srcValue) : record(srcKey, srcValue, dstIdx, !1) : isEventHandler && !vnode.element.qDispatchEvent && recordJsxEvent(srcKey, srcValue), 
                     srcIdx += 2, dstIdx += 2;
                 } else if (srcKey < dstKey) {
                     const srcValue = srcAttrs[srcIdx + 1];
-                    isHtmlAttributeAnEventName(srcKey) ? recordJsxEvent(srcKey, srcValue) : record(srcKey, srcValue), 
+                    isHtmlAttributeAnEventName(srcKey) ? recordJsxEvent(srcKey, srcValue) : record(srcKey, srcValue, dstIdx, !0), 
                     srcIdx += 2, dstIdx += 2;
                 } else {
-                    isHtmlAttributeAnEventName(dstKey) ? dstIdx += 2 : record(dstKey, null);
+                    isHtmlAttributeAnEventName(dstKey) ? dstIdx += 2 : record(dstKey, null, dstIdx, !1);
                 }
             }
             return patchEventDispatch;
@@ -3776,13 +3838,9 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 }), host = vNewNode || vCurrent;
             }
             if (host) {
-                let vNodeProps = host.getProp("q:props", container.$getObjectById$);
-                let propsAreDifferent = !1;
-                shouldRender || (propsAreDifferent = propsDiffer(jsxProps[_CONST_PROPS], vNodeProps?.[_CONST_PROPS]) || propsDiffer(jsxProps[_VAR_PROPS], vNodeProps?.[_VAR_PROPS]), 
-                shouldRender = shouldRender || propsAreDifferent), shouldRender && (propsAreDifferent && (vNodeProps ? (vNodeProps[_CONST_PROPS] = jsxProps[_CONST_PROPS], 
-                vNodeProps[_VAR_PROPS] = jsxProps[_VAR_PROPS], vNodeProps[_OWNER] = jsxProps[_OWNER]) : jsxProps && (host.setProp("q:props", jsxProps), 
-                vNodeProps = jsxProps)), host.setProp("q:renderFn", componentQRL), host.flags &= -33, 
-                container.$scheduler$(6, host, componentQRL, vNodeProps));
+                const vNodeProps = host.getProp("q:props", container.$getObjectById$);
+                shouldRender || (shouldRender ||= handleProps(host, jsxProps, vNodeProps, container)), 
+                shouldRender && (host.setProp("q:renderFn", componentQRL), host.flags &= -33, container.$scheduler$(6, host, componentQRL, vNodeProps));
             }
             !function(children, host) {
                 const projectionChildren = Array.isArray(children) ? children : [ children ];
@@ -3872,7 +3930,23 @@ function getComponentHash(vNode, getObject) {
 
 function Projection() {}
 
-function propsDiffer(src, dst) {
+function handleProps(host, jsxProps, vNodeProps, container) {
+    let shouldRender = !1;
+    let propsAreDifferent = !1;
+    if (vNodeProps) {
+        const effects = vNodeProps[_PROPS_HANDLER].$effects$;
+        const constPropsDifferent = handleChangedProps(jsxProps[_CONST_PROPS], vNodeProps[_CONST_PROPS], vNodeProps[_PROPS_HANDLER], container, !1);
+        if (propsAreDifferent = constPropsDifferent, shouldRender ||= constPropsDifferent, 
+        effects && effects.size > 0) {
+            const varPropsDifferent = handleChangedProps(jsxProps[_VAR_PROPS], vNodeProps[_VAR_PROPS], vNodeProps[_PROPS_HANDLER], container);
+            propsAreDifferent ||= varPropsDifferent;
+        }
+    }
+    return propsAreDifferent && (vNodeProps ? vNodeProps[_OWNER] = jsxProps[_OWNER] : jsxProps && (host.setProp("q:props", jsxProps), 
+    vNodeProps = jsxProps)), shouldRender;
+}
+
+function handleChangedProps(src, dst, propsHandler, container, triggerEffects = !0) {
     const srcEmpty = isPropsEmpty(src);
     const dstEmpty = isPropsEmpty(dst);
     if (srcEmpty && dstEmpty) {
@@ -3889,12 +3963,17 @@ function propsDiffer(src, dst) {
     "q:brefs" in dst && dstLen--, srcLen !== dstLen) {
         return !0;
     }
+    let changed = !1;
+    propsHandler.$container$ = container;
     for (const key of srcKeys) {
         if ("children" !== key && "q:brefs" !== key && (!Object.prototype.hasOwnProperty.call(dst, key) || src[key] !== dst[key])) {
-            return !0;
+            if (changed = !0, !triggerEffects) {
+                return !0;
+            }
+            triggerPropsProxyEffect(propsHandler, key);
         }
     }
-    return !1;
+    return changed;
 }
 
 function isPropsEmpty(props) {
@@ -4082,7 +4161,7 @@ function findAncestorBlockingChore(chore, type) {
         const blockingChores = isNormalQueue ? current.chores : current.blockedChores;
         if (blockingChores) {
             for (const blockingChore of blockingChores) {
-                if (blockingChore.$type$ < 16 && 3 !== blockingChore.$type$ && 1 !== blockingChore.$type$ && 2 !== blockingChore.$type$) {
+                if (blockingChore.$type$ < 16 && 3 !== blockingChore.$type$ && 1 !== blockingChore.$type$ && 2 !== blockingChore.$type$ && blockingChore.$state$ === ChoreState.NONE) {
                     return blockingChore;
                 }
             }
@@ -4104,17 +4183,17 @@ function findBlockingChore(chore, choreQueue, blockedChores, runningChores, cont
     for (const rule of BLOCKING_RULES) {
         if (chore.$type$ === rule.blockedType) {
             for (const candidate of choreQueue) {
-                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container)) {
+                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container) && candidate.$state$ === ChoreState.NONE) {
                     return candidate;
                 }
             }
             for (const candidate of blockedChores) {
-                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container)) {
+                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container) && candidate.$state$ === ChoreState.NONE) {
                     return candidate;
                 }
             }
             for (const candidate of runningChores) {
-                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container)) {
+                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container) && candidate.$state$ !== ChoreState.FAILED) {
                     return candidate;
                 }
             }
@@ -4141,7 +4220,7 @@ function findBlockingChoreForVisible(chore, runningChores, container) {
     for (const rule of VISIBLE_BLOCKING_RULES) {
         if (chore.$type$ === rule.blockedType) {
             for (const candidate of runningChores) {
-                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container)) {
+                if (candidate.$type$ === rule.blockingType && rule.match(chore, candidate, container) && candidate.$state$ !== ChoreState.FAILED) {
                     return candidate;
                 }
             }
@@ -4294,7 +4373,7 @@ function choreComparator(a, b) {
         return microTypeDiff;
     }
     const idxDiff = toNumber(a.$idx$) - toNumber(b.$idx$);
-    return 0 !== idxDiff ? idxDiff : a.$target$ !== b.$target$ ? isQrl(a.$target$) && isQrl(b.$target$) && a.$target$.$hash$ === b.$target$.$hash$ ? 0 : 1 : 7 === a.$type$ && 7 === b.$type$ && (a.$target$ instanceof StoreHandler && b.$target$ instanceof StoreHandler || a.$target$ instanceof AsyncComputedSignalImpl && b.$target$ instanceof AsyncComputedSignalImpl) && a.$payload$ !== b.$payload$ ? 1 : 0;
+    return 0 !== idxDiff ? idxDiff : a.$target$ !== b.$target$ ? isQrl(a.$target$) && isQrl(b.$target$) && a.$target$.$hash$ === b.$target$.$hash$ ? 0 : 1 : 7 === a.$type$ && 7 === b.$type$ && (a.$target$ instanceof StoreHandler && b.$target$ instanceof StoreHandler || a.$target$ instanceof PropsProxyHandler && b.$target$ instanceof PropsProxyHandler || a.$target$ instanceof AsyncComputedSignalImpl && b.$target$ instanceof AsyncComputedSignalImpl) && a.$payload$ !== b.$payload$ ? 1 : 0;
 }
 
 function toNumber(value) {
@@ -4365,10 +4444,6 @@ const createScheduler = (container, journalFlush, choreQueue, blockedChores, run
             }
         }
         if (1 !== chore.$type$ && 2 !== chore.$type$) {
-            const blockingChore = findBlockingChore(chore, choreQueue, blockedChores, runningChores, container);
-            if (blockingChore) {
-                return addBlockedChore(chore, blockingChore, blockedChores), chore;
-            }
             const runningChore = function(chore) {
                 if (runningChores.size) {
                     for (const runningChore of runningChores) {
@@ -4380,7 +4455,12 @@ const createScheduler = (container, journalFlush, choreQueue, blockedChores, run
                 return null;
             }(chore);
             if (runningChore) {
-                return addBlockedChore(chore, runningChore, blockedChores), chore;
+                return isResourceChore(runningChore) && addBlockedChore(chore, runningChore, blockedChores), 
+                chore;
+            }
+            const blockingChore = findBlockingChore(chore, choreQueue, blockedChores, runningChores, container);
+            if (blockingChore) {
+                return addBlockedChore(chore, blockingChore, blockedChores), chore;
             }
         }
         addChoreAndIncrementBlockingCounter(chore, choreQueue);
@@ -4453,7 +4533,7 @@ const createScheduler = (container, journalFlush, choreQueue, blockedChores, run
                     applyJournalFlush();
                     const blockingChore = findBlockingChoreForVisible(chore, runningChores, container);
                     if (blockingChore && blockingChore.$state$ === ChoreState.RUNNING) {
-                        addBlockedChore(chore, blockingChore, blockedChores);
+                        (blockingChore.$blockedChores$ ||= new ChoreArray).add(chore);
                         continue;
                     }
                 }
@@ -4610,9 +4690,13 @@ function vNodeAlreadyDeleted(chore) {
     return !!(chore.$host$ && vnode_isVNode(chore.$host$) && 32 & chore.$host$.flags);
 }
 
+function isResourceChore(chore) {
+    return 3 === chore.$type$ && !!chore.$payload$ && !!(4 & chore.$payload$.$flags$);
+}
+
 function addBlockedChore(blockedChore, blockingChore, blockedChores) {
-    (blockingChore.$blockedChores$ ||= new ChoreArray).add(blockedChore), blockedChores.add(blockedChore), 
-    vnode_isVNode(blockedChore.$host$) && (blockedChore.$host$.blockedChores ||= new ChoreArray).add(blockedChore);
+    (isResourceChore(blockedChore) || 0 !== choreComparator(blockedChore, blockingChore)) && ((blockingChore.$blockedChores$ ||= new ChoreArray).add(blockedChore), 
+    blockedChores.add(blockedChore), vnode_isVNode(blockedChore.$host$) && (blockedChore.$host$.blockedChores ||= new ChoreArray).add(blockedChore));
 }
 
 function isRenderBlocking(type) {
@@ -4687,7 +4771,7 @@ function debugTrace(action, arg, queue, blockedChores) {
             lines.push(`${activeMarker}${state} ${type} ${1 === chore.$type$ || 2 === chore.$type$ ? qrlTarget : host} ${chore.$idx$}`);
         }
     }
-    blockedChores && blockedChores.size > 0 && (lines.push(""), lines.push(`🚫 Blocked Chores (${blockedChores.size} items):`), 
+    blockedChores && blockedChores.length > 0 && (lines.push(""), lines.push(`🚫 Blocked Chores (${blockedChores.length} items):`), 
     Array.from(blockedChores).forEach((chore, index) => {
         const type = debugChoreTypeToString(chore.$type$);
         const host = String(chore.$host$).replaceAll(/\n.*/gim, "");
@@ -4727,14 +4811,14 @@ async function serialize(serializationContext) {
     const s11nWeakRefs = new Map;
     let parent;
     const qrlMap = new Map;
-    const outputArray = (value, keepNulls, writeFn) => {
+    const outputArray = (value, keepUndefined, writeFn) => {
         $writer$.write("[");
         let separator = !1;
         let length;
-        if (keepNulls) {
+        if (keepUndefined) {
             length = value.length;
         } else {
-            for (length = value.length - 1; length >= 0 && null === value[length]; ) {
+            for (length = value.length - 1; length >= 0 && void 0 === value[length]; ) {
                 length--;
             }
             length++;
@@ -4744,7 +4828,7 @@ async function serialize(serializationContext) {
         }
         $writer$.write("]");
     };
-    const output = (type, value, keepNulls) => {
+    const output = (type, value, keepUndefined) => {
         if ($writer$.write(`${type},`), "number" == typeof value) {
             $writer$.write(value.toString());
         } else if ("string" == typeof value) {
@@ -4756,7 +4840,7 @@ async function serialize(serializationContext) {
             }
             $writer$.write(0 === lastIdx ? s : s.slice(lastIdx));
         } else {
-            outputArray(value, keepNulls, (valueItem, idx) => {
+            outputArray(value, !!keepUndefined, (valueItem, idx) => {
                 writeValue(valueItem, idx);
             });
         }
@@ -4874,7 +4958,7 @@ async function serialize(serializationContext) {
     const writeObjectValue = value => {
         if (isPropsProxy(value)) {
             const owner = value[_OWNER];
-            output(32, [ _serializationWeakRef(owner), owner.varProps, owner.constProps ]);
+            output(32, [ _serializationWeakRef(owner), owner.varProps, owner.constProps, value[_PROPS_HANDLER].$effects$ ]);
         } else if (value instanceof SubscriptionData) {
             output(33, [ value.data.$scopedStyleIdPrefix$, value.data.$isConst$ ]);
         } else if (isStore(value)) {
@@ -4893,7 +4977,7 @@ async function serialize(serializationContext) {
                     innerStore && innerStores.push(innerStore);
                 }
                 const out = [ storeTarget, flags, effects, ...innerStores ];
-                for (;null == out[out.length - 1]; ) {
+                for (;void 0 === out[out.length - 1]; ) {
                     out.pop();
                 }
                 output(29, out);
@@ -4901,7 +4985,7 @@ async function serialize(serializationContext) {
         } else if (isSerializerObj(value)) {
             const result = value[SerializerSymbol](value);
             if (isPromise(result)) {
-                const forwardRef = resolvePromise(result, $addRoot$, (resolved, resolvedValue) => new PromiseResult(28, resolved, resolvedValue, null, null));
+                const forwardRef = resolvePromise(result, $addRoot$, (resolved, resolvedValue) => new PromiseResult(28, resolved, resolvedValue, void 0, void 0));
                 output(2, forwardRef);
             } else {
                 const index = parent.$index$;
@@ -4925,8 +5009,14 @@ async function serialize(serializationContext) {
         } else if (value instanceof SignalImpl) {
             if (value instanceof SerializerSignalImpl) {
                 addPreloadQrl(value.$computeQrl$);
-                const forwardRefId = resolvePromise(getCustomSerializerPromise(value, value.$untrackedValue$), $addRoot$, (resolved, resolvedValue) => new PromiseResult(28, resolved, resolvedValue, value.$effects$, value.$computeQrl$));
-                return void output(2, forwardRefId);
+                const maybeValue = getCustomSerializerPromise(value, value.$untrackedValue$);
+                if (isPromise(maybeValue)) {
+                    const forwardRefId = resolvePromise(maybeValue, $addRoot$, (resolved, resolvedValue) => new PromiseResult(28, resolved, resolvedValue, value.$effects$, value.$computeQrl$));
+                    output(2, forwardRefId);
+                } else {
+                    output(28, [ value.$computeQrl$, value.$effects$, maybeValue ]);
+                }
+                return;
             }
             if (value instanceof WrappedSignalImpl) {
                 output(25, [ ...serializeWrappingFn(serializationContext, value), filterEffectBackRefs(value[_EFFECT_BACK_REF]), value.$flags$, value.$hostElement$, ...value.$effects$ || [] ]);
@@ -4940,10 +5030,15 @@ async function serialize(serializationContext) {
                 addPreloadQrl(value.$computeQrl$);
                 const out = [ value.$computeQrl$, value.$effects$ ];
                 const isAsync = value instanceof AsyncComputedSignalImpl;
-                isAsync && out.push(value.$loadingEffects$, value.$errorEffects$, value.$untrackedLoading$, value.$untrackedError$), 
-                v !== NEEDS_COMPUTATION && out.push(v), output(isAsync ? 27 : 26, out);
+                isAsync && out.push(value.$loadingEffects$, value.$errorEffects$, value.$untrackedLoading$, value.$untrackedError$);
+                let keepUndefined = !1;
+                v !== NEEDS_COMPUTATION && (out.push(v), isAsync || void 0 !== v || (keepUndefined = !0)), 
+                output(isAsync ? 27 : 26, out, keepUndefined);
             } else {
-                output(24, [ value.$untrackedValue$, ...value.$effects$ || [] ]);
+                const v = value.$untrackedValue$;
+                const keepUndefined = void 0 === v;
+                const out = [ v ];
+                value.$effects$ && out.push(...value.$effects$), output(24, out, keepUndefined);
             }
         } else if (value instanceof URL) {
             output(6, value.href);
@@ -4990,14 +5085,14 @@ async function serialize(serializationContext) {
             }
             output(17, combined);
         } else if (isJSXNode(value)) {
-            const out = [ value.type, value.key, value.varProps, value.constProps, value.children, value.toSort || null ];
-            for (;null == out[out.length - 1]; ) {
+            const out = [ value.type, value.key, value.varProps, value.constProps, value.children, value.toSort || void 0 ];
+            for (;void 0 === out[out.length - 1]; ) {
                 out.pop();
             }
             output(31, out);
         } else if (value instanceof Task) {
             const out = [ value.$qrl$, value.$flags$, value.$index$, value.$el$, value[_EFFECT_BACK_REF], value.$state$ ];
-            for (;null == out[out.length - 1]; ) {
+            for (;void 0 === out[out.length - 1]; ) {
                 out.pop();
             }
             output(21, out);
@@ -5089,19 +5184,17 @@ class PromiseResult {
     $value$;
     $effects$;
     $qrl$;
-    constructor($type$, $resolved$, $value$, $effects$ = null, $qrl$ = null) {
+    constructor($type$, $resolved$, $value$, $effects$, $qrl$) {
         this.$type$ = $type$, this.$resolved$ = $resolved$, this.$value$ = $value$, this.$effects$ = $effects$, 
         this.$qrl$ = $qrl$;
     }
 }
 
 function getCustomSerializerPromise(signal, value) {
-    return new Promise(resolve => {
-        signal.$computeQrl$.resolve().then(arg => {
-            let data;
-            arg.serialize ? data = arg.serialize(value) : SerializerSymbol in value && (data = value[SerializerSymbol](value)), 
-            void 0 === data && (data = NEEDS_COMPUTATION), resolve(data);
-        });
+    return value === NEEDS_COMPUTATION ? value : maybeThen(signal.$computeQrl$.resolved || signal.$computeQrl$.resolve(), arg => {
+        let data;
+        return "function" == typeof arg && (arg = arg()), arg.serialize ? data = arg.serialize(value) : "object" == typeof value && SerializerSymbol in value && (data = value[SerializerSymbol](value)), 
+        void 0 === data && (data = NEEDS_COMPUTATION), data;
     });
 }
 
@@ -5133,7 +5226,7 @@ function serializeWrappingFn(serializationContext, value) {
 }
 
 function filterEffectBackRefs(effectBackRef) {
-    let effectBackRefToSerialize = null;
+    let effectBackRefToSerialize;
     if (effectBackRef) {
         for (const [effectProp, effect] of effectBackRef) {
             effect[2] && (effectBackRefToSerialize ||= new Map, effectBackRefToSerialize.set(effectProp, effect));
@@ -5260,7 +5353,7 @@ class _SharedContainer {
             throw Error("Not implemented");
         };
         const choreQueue = new ChoreArray;
-        const blockedChores = new Set;
+        const blockedChores = new ChoreArray;
         const runningChores = new Set;
         this.$scheduler$ = createScheduler(this, journalFlush, choreQueue, blockedChores, runningChores);
     }
@@ -5371,12 +5464,12 @@ function processJSXNode(ssr, enqueue, value, options) {
                 appendClassIfScopedStyleExists(jsx, options.styleScoped);
                 let qwikInspectorAttrValue = null;
                 isDev && jsx.dev && "head" !== jsx.type && (qwikInspectorAttrValue = getFileLocationFromJsx(jsx.dev));
-                const innerHTML = ssr.openElement(type, varPropsToSsrAttrs(jsx.varProps, jsx.constProps, {
+                const innerHTML = ssr.openElement(type, toSsrAttrs(jsx.varProps, {
                     serializationCtx: ssr.serializationCtx,
                     styleScopedId: options.styleScoped,
                     key: jsx.key,
                     toSort: jsx.toSort
-                }), constPropsToSsrAttrs(jsx.constProps, jsx.varProps, {
+                }), toSsrAttrs(jsx.constProps, {
                     serializationCtx: ssr.serializationCtx,
                     styleScopedId: options.styleScoped
                 }), qwikInspectorAttrValue);
@@ -5430,10 +5523,18 @@ function processJSXNode(ssr, enqueue, value, options) {
                     const componentFrame = ssr.getParentComponentFrame();
                     componentFrame.distributeChildrenIntoSlots(jsx.children, options.styleScoped, options.parentComponentFrame);
                     const jsxOutput = applyQwikComponentBody(ssr, jsx, type);
-                    const compStyleComponentId = addComponentStylePrefix(host.getProp("q:sstyle"));
-                    enqueue(new ParentComponentData(options.styleScoped, options.parentComponentFrame)), 
-                    enqueue(ssr.closeComponent), enqueue(jsxOutput), isPromise(jsxOutput) && enqueue(Promise), 
-                    enqueue(new ParentComponentData(compStyleComponentId, componentFrame));
+                    if (enqueue(new ParentComponentData(options.styleScoped, options.parentComponentFrame)), 
+                    enqueue(ssr.closeComponent), isPromise(jsxOutput)) {
+                        enqueue(async () => {
+                            const resolvedOutput = await jsxOutput;
+                            const compStyleComponentId = addComponentStylePrefix(host.getProp("q:sstyle"));
+                            enqueue(resolvedOutput), enqueue(new ParentComponentData(compStyleComponentId, componentFrame));
+                        });
+                    } else {
+                        enqueue(jsxOutput);
+                        const compStyleComponentId = addComponentStylePrefix(host.getProp("q:sstyle"));
+                        enqueue(new ParentComponentData(compStyleComponentId, componentFrame));
+                    }
                 } else {
                     const inlineComponentProps = [ "q:key", jsx.key ];
                     ssr.openFragment(isDev ? [ "q:type", "I", ...inlineComponentProps ] : inlineComponentProps), 
@@ -5447,14 +5548,6 @@ function processJSXNode(ssr, enqueue, value, options) {
     }
 }
 
-function varPropsToSsrAttrs(varProps, constProps, options) {
-    return toSsrAttrs(varProps, options);
-}
-
-function constPropsToSsrAttrs(constProps, varProps, options) {
-    return toSsrAttrs(constProps, options);
-}
-
 function toSsrAttrs(record, options) {
     if (null == record) {
         return null;
@@ -5510,12 +5603,15 @@ function setEvent(serializationCtx, key, rawValue) {
 function addQwikEventToSerializationContext(serializationCtx, key, qrl) {
     const data = getEventDataFromHtmlAttribute(key);
     if (data) {
-        serializationCtx.$eventNames$.add(data[1]), serializationCtx.$eventQrls$.add(qrl);
+        const [scope, eventName] = data;
+        const scopedEvent = getScopedEventName(scope, eventName);
+        const loaderScopedEvent = getLoaderScopedEventName(scope, scopedEvent);
+        serializationCtx.$eventNames$.add(loaderScopedEvent), serializationCtx.$eventQrls$.add(qrl);
     }
 }
 
 function addPreventDefaultEventToSerializationContext(serializationCtx, key) {
-    const eventName = key.substring(15);
+    const eventName = key.substring(14);
     eventName && serializationCtx.$eventNames$.add(eventName);
 }
 
@@ -5615,7 +5711,7 @@ const inflate = (container, target, typeId, data) => {
                 const d = data;
                 asyncComputed.$computeQrl$ = d[0], asyncComputed.$effects$ = new Set(d[1]), asyncComputed.$loadingEffects$ = new Set(d[2]), 
                 asyncComputed.$errorEffects$ = new Set(d[3]), asyncComputed.$untrackedLoading$ = d[4], 
-                asyncComputed.$untrackedError$ = d[5] || null;
+                asyncComputed.$untrackedError$ = d[5];
                 d.length > 6 && (asyncComputed.$untrackedValue$ = d[6], asyncComputed.$promiseValue$ = d[6]), 
                 asyncComputed.$flags$ |= 1;
                 break;
@@ -5626,7 +5722,7 @@ const inflate = (container, target, typeId, data) => {
             {
                 const computed = target;
                 const d = data;
-                computed.$computeQrl$ = d[0], computed.$effects$ = new Set(d[1]);
+                computed.$computeQrl$ = d[0], d[1] && (computed.$effects$ = new Set(d[1]));
                 d.length > 2 ? (computed.$untrackedValue$ = d[2], 28 === typeId && (computed.$flags$ |= 1)) : (computed.$flags$ |= 1, 
                 computed.$computeQrl$.resolve(), container.$scheduler$(1, null, computed.$computeQrl$));
                 break;
@@ -5701,9 +5797,10 @@ const inflate = (container, target, typeId, data) => {
 
           case 32:
             const propsProxy = target;
-            let owner = data[0];
-            owner === _UNINITIALIZED && (owner = new JSXNodeImpl(Fragment, data[1], data[2]), 
-            owner._proxy = propsProxy), propsProxy[_OWNER] = owner;
+            const d = data;
+            let owner = d[0];
+            owner === _UNINITIALIZED && (owner = new JSXNodeImpl(Fragment, d[1], d[2]), owner._proxy = propsProxy), 
+            propsProxy[_OWNER] = owner, propsProxy[_PROPS_HANDLER].$effects$ = d[3];
             break;
 
           case 33:
@@ -6035,15 +6132,15 @@ class DomContainer extends _SharedContainer {
         this.$rawStateData$ = [], this.$stateData$ = [];
         const document = this.element.ownerDocument;
         document.qVNodeData || processVNodeData(document), this.$qFuncs$ = getQFuncs(document, this.$instanceHash$) || EMPTY_ARRAY, 
-        this.$setServerData$(), element.setAttribute("q:container", "resumed"), element.qContainer = this, 
-        element.isConnected && element.dispatchEvent(new CustomEvent("qresume", {
-            bubbles: !0
-        }));
+        this.$setServerData$(), element.setAttribute("q:container", "resumed"), element.qContainer = this;
         const qwikStates = element.querySelectorAll('script[type="qwik/state"]');
         if (0 !== qwikStates.length) {
             this.$rawStateData$ = JSON.parse(qwikStates[qwikStates.length - 1].textContent), 
             preprocessState(this.$rawStateData$, this), this.$stateData$ = wrapDeserializerProxy(this, this.$rawStateData$);
         }
+        element.isConnected && element.dispatchEvent(new CustomEvent("qresume", {
+            bubbles: !0
+        }));
     }
     $setRawState$(id, vParent) {
         this.$stateData$[id] = vParent;
@@ -6338,7 +6435,7 @@ const getOrCreateStore = (obj, flags, container) => {
 class StoreHandler {
     $flags$;
     $container$;
-    $effects$=null;
+    $effects$=void 0;
     constructor($flags$, $container$) {
         this.$flags$ = $flags$, this.$container$ = $container$;
     }
@@ -6347,7 +6444,7 @@ class StoreHandler {
     }
     force(prop) {
         const target = getStoreTarget(this);
-        this.$container$?.$scheduler$(7, null, this, getEffects(target, prop, this.$effects$));
+        this.$container$?.$scheduler$(7, void 0, this, getEffects(target, prop, this.$effects$));
     }
     get(target, prop) {
         if ("symbol" == typeof prop) {
@@ -6385,7 +6482,7 @@ class StoreHandler {
         return !0;
     }
     deleteProperty(target, prop) {
-        return "string" == typeof prop && delete target[prop] && (Array.isArray(target) || this.$container$?.$scheduler$(7, null, this, getEffects(target, prop, this.$effects$)), 
+        return "string" == typeof prop && delete target[prop] && (Array.isArray(target) || this.$container$?.$scheduler$(7, void 0, this, getEffects(target, prop, this.$effects$)), 
         !0);
     }
     has(target, prop) {
@@ -6426,7 +6523,7 @@ function addStoreEffect(target, prop, store, effectSubscription) {
 function setNewValueAndTriggerEffects(prop, value, target, currentStore) {
     target[prop] = value;
     const effects = getEffects(target, prop, currentStore.$effects$);
-    effects && currentStore.$container$?.$scheduler$(7, null, currentStore, effects);
+    effects && currentStore.$container$?.$scheduler$(7, void 0, currentStore, effects);
 }
 
 function getEffects(target, prop, storeEffects) {
@@ -6450,7 +6547,7 @@ function getEffects(target, prop, storeEffects) {
             effectsToTrigger.add(effect);
         }
     }
-    return effectsToTrigger || null;
+    return effectsToTrigger;
 }
 
 const canSerialize = (value, seen = new WeakSet) => {
@@ -7266,15 +7363,15 @@ const useVisibleTaskQrl = (qrl, opts) => {
     const {val, set, i, iCtx} = useSequentialScope();
     const eagerness = opts?.strategy ?? "intersection-observer";
     if (val) {
-        return void (isServerPlatform() && useRunTask(val, eagerness));
+        return void (32 & val.$flags$ || isServerPlatform() || (val.$flags$ |= 32, useRegisterTaskEvents(val, eagerness)));
     }
     assertQrl(qrl);
     const task = new Task(1, i, iCtx.$hostElement$, qrl, void 0, null);
-    set(task), useRunTask(task, eagerness), isServerPlatform() || (qrl.resolve(iCtx.$element$), 
+    set(task), useRegisterTaskEvents(task, eagerness), isServerPlatform() || (qrl.resolve(iCtx.$element$), 
     iCtx.$container$.$scheduler$(16, task));
 };
 
-const useRunTask = (task, eagerness) => {
+const useRegisterTaskEvents = (task, eagerness) => {
     "intersection-observer" === eagerness ? useOn("qvisible", getTaskHandlerQrl(task)) : "document-ready" === eagerness ? useOnDocument("qinit", getTaskHandlerQrl(task)) : "document-idle" === eagerness && useOnDocument("qidle", getTaskHandlerQrl(task));
 };