@qwik.dev/core 2.0.0-alpha.5 → 2.0.0-alpha.7

package/dist/core.prod.mjs

@@ -1,11 +1,11 @@
 /**
  * @license
- * @qwik.dev/core 2.0.0-alpha.5-dev+cb53bbd
+ * @qwik.dev/core 2.0.0-alpha.7-dev+a26598a
  * 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
  */
-import { isServer, isDev } from "@qwik.dev/core/build";
+import { isDev, isServer } from "@qwik.dev/core/build";
 
 export { isBrowser, isDev, isServer } from "@qwik.dev/core/build";
 
@@ -80,8 +80,8 @@ const codeToText = code => `Code(Q${code}) https://github.com/QwikDev/qwik/blob/
 var QError;
 
 !function(QError) {
-    QError[QError.stringifyClassOrStyle = 0] = "stringifyClassOrStyle", QError[QError.UNUSED_1 = 1] = "UNUSED_1", 
-    QError[QError.UNUSED_2 = 2] = "UNUSED_2", QError[QError.verifySerializable = 3] = "verifySerializable", 
+    QError[QError.stringifyClassOrStyle = 0] = "stringifyClassOrStyle", QError[QError.schedulerNotFound = 1] = "schedulerNotFound", 
+    QError[QError.trackObjectWithoutProp = 2] = "trackObjectWithoutProp", QError[QError.verifySerializable = 3] = "verifySerializable", 
     QError[QError.UNUSED_4 = 4] = "UNUSED_4", QError[QError.cannotRenderOverExistingContainer = 5] = "cannotRenderOverExistingContainer", 
     QError[QError.UNUSED_6 = 6] = "UNUSED_6", QError[QError.UNUSED_7 = 7] = "UNUSED_7", 
     QError[QError.UNUSED_8 = 8] = "UNUSED_8", QError[QError.UNUSED_9 = 9] = "UNUSED_9", 
@@ -104,10 +104,9 @@ var QError;
     QError[QError.serializeErrorMissingChunk = 39] = "serializeErrorMissingChunk", QError[QError.wrongTextareaValue = 40] = "wrongTextareaValue", 
     QError[QError.containerNotFound = 41] = "containerNotFound", QError[QError.elementWithoutContainer = 42] = "elementWithoutContainer", 
     QError[QError.invalidVNodeType = 43] = "invalidVNodeType", QError[QError.materializeVNodeDataError = 44] = "materializeVNodeDataError", 
-    QError[QError.serverHostMismatch = 45] = "serverHostMismatch", QError[QError.cannotCoerceSignal = 46] = "cannotCoerceSignal", 
-    QError[QError.computedNotSync = 47] = "computedNotSync", QError[QError.computedReadOnly = 48] = "computedReadOnly", 
-    QError[QError.wrappedReadOnly = 49] = "wrappedReadOnly", QError[QError.promisesNotExpected = 50] = "promisesNotExpected", 
-    QError[QError.unsafeAttr = 51] = "unsafeAttr";
+    QError[QError.cannotCoerceSignal = 45] = "cannotCoerceSignal", QError[QError.computedNotSync = 46] = "computedNotSync", 
+    QError[QError.computedReadOnly = 47] = "computedReadOnly", QError[QError.wrappedReadOnly = 48] = "wrappedReadOnly", 
+    QError[QError.unsafeAttr = 49] = "unsafeAttr";
 }(QError || (QError = {}));
 
 const qError = (code, errorMessageArgs = []) => {
@@ -115,117 +114,23 @@ const qError = (code, errorMessageArgs = []) => {
     return logErrorAndStop(text, ...errorMessageArgs);
 };
 
-const createPlatform = () => ({
-    isServer,
-    importSymbol(containerEl, url, symbolName) {
-        if (isServer) {
-            const hash = getSymbolHash(symbolName);
-            const regSym = globalThis.__qwik_reg_symbols?.get(hash);
-            if (regSym) {
-                return regSym;
-            }
-        }
-        if (!url) {
-            throw qError(QError.qrlMissingChunk, [ symbolName ]);
-        }
-        if (!containerEl) {
-            throw qError(QError.qrlMissingContainer, [ url, symbolName ]);
-        }
-        const urlDoc = toUrl(containerEl.ownerDocument, containerEl, url).toString();
-        const urlCopy = new URL(urlDoc);
-        urlCopy.hash = "";
-        return import(urlCopy.href).then((mod => mod[symbolName]));
-    },
-    raf: fn => new Promise((resolve => {
-        requestAnimationFrame((() => {
-            resolve(fn());
-        }));
-    })),
-    nextTick: fn => new Promise((resolve => {
-        setTimeout((() => {
-            resolve(fn());
-        }));
-    })),
-    chunkForSymbol: (symbolName, chunk) => [ symbolName, chunk ?? "_" ]
-});
-
-const toUrl = (doc, containerEl, url) => {
-    const baseURI = doc.baseURI;
-    const base = new URL(containerEl.getAttribute("q:base") ?? baseURI, baseURI);
-    return new URL(url, base);
-};
-
-let _platform = /*#__PURE__ */ createPlatform();
-
-const setPlatform = plt => _platform = plt;
-
-const getPlatform = () => _platform;
-
-const isServerPlatform = () => _platform.isServer;
-
-const isNode = value => value && "number" == typeof value.nodeType;
-
-const isDocument = value => 9 === value.nodeType;
-
-const isElement$1 = value => 1 === value.nodeType;
-
-const MAX_RETRY_ON_PROMISE_COUNT = 100;
-
-const isPromise = value => !!value && "object" == typeof value && "function" == typeof value.then;
-
-const safeCall = (call, thenFn, rejectFn) => {
-    try {
-        const result = call();
-        return isPromise(result) ? result.then(thenFn, rejectFn) : thenFn(result);
-    } catch (e) {
-        return rejectFn(e);
-    }
-};
-
-const maybeThen = (valueOrPromise, thenFn) => isPromise(valueOrPromise) ? valueOrPromise.then(thenFn, shouldNotError) : thenFn(valueOrPromise);
-
-const maybeThenPassError = (valueOrPromise, thenFn) => isPromise(valueOrPromise) ? valueOrPromise.then(thenFn) : thenFn(valueOrPromise);
+const SYNC_QRL = "<sync>";
 
-const shouldNotError = reason => {
-    throwErrorAndStop(reason);
-};
+const isSyncQrl = value => isQrl$1(value) && "<sync>" == value.$symbol$;
 
-const delay = timeout => new Promise((resolve => {
-    setTimeout(resolve, timeout);
-}));
+const isQrl$1 = value => "function" == typeof value && "function" == typeof value.getSymbol;
 
-function retryOnPromise(fn, retryCount = 0) {
-    try {
-        return fn();
-    } catch (e) {
-        if (isPromise(e) && retryCount < 100) {
-            return e.then(retryOnPromise.bind(null, fn, retryCount++));
-        }
-        throw e;
+function assertQrl(qrl) {
+    if (isDev && !isQrl$1(qrl)) {
+        throw new Error("Not a QRL");
     }
 }
 
-const isSerializableObject = v => {
-    const proto = Object.getPrototypeOf(v);
-    return proto === Object.prototype || proto === Array.prototype || null === proto;
+const getSymbolHash = symbolName => {
+    const index = symbolName.lastIndexOf("_");
+    return index > -1 ? symbolName.slice(index + 1) : symbolName;
 };
 
-const isObject = v => !!v && "object" == typeof v;
-
-const isArray = v => Array.isArray(v);
-
-const isString = v => "string" == typeof v;
-
-const isFunction = v => "function" == typeof v;
-
-var VNodeDataFlag;
-
-!function(VNodeDataFlag) {
-    VNodeDataFlag[VNodeDataFlag.NONE = 0] = "NONE", VNodeDataFlag[VNodeDataFlag.TEXT_DATA = 1] = "TEXT_DATA", 
-    VNodeDataFlag[VNodeDataFlag.VIRTUAL_NODE = 2] = "VIRTUAL_NODE", VNodeDataFlag[VNodeDataFlag.ELEMENT_NODE = 4] = "ELEMENT_NODE", 
-    VNodeDataFlag[VNodeDataFlag.REFERENCE = 8] = "REFERENCE", VNodeDataFlag[VNodeDataFlag.SERIALIZE = 16] = "SERIALIZE";
-}(VNodeDataFlag || (VNodeDataFlag = {}));
-
 const DEBUG_TYPE = "q:type";
 
 var VirtualType;
@@ -259,7 +164,7 @@ var QContainerValue;
 
 const OnRenderProp = "q:renderFn";
 
-const ComponentStylesPrefixContent = "⭐️";
+const ComponentStylesPrefixContent = "⚡️";
 
 const QSlot = "q:slot";
 
@@ -281,7 +186,7 @@ const QScopedStyle = "q:sstyle";
 
 const QCtxAttr = "q:ctx";
 
-const QSubscribers = "q:subs";
+const QBackRefs = "q:brefs";
 
 const QFuncsPrefix = "qFuncs_";
 
@@ -357,6 +262,113 @@ const dangerouslySetInnerHTML = "dangerouslySetInnerHTML";
 
 const qwikInspectorAttr = "data-qwik-inspector";
 
+const createPlatform = () => ({
+    isServer,
+    importSymbol(containerEl, url, symbolName) {
+        if (isServer) {
+            const hash = getSymbolHash(symbolName);
+            const regSym = globalThis.__qwik_reg_symbols?.get(hash);
+            if (regSym) {
+                return regSym;
+            }
+        }
+        if (!url) {
+            throw qError(QError.qrlMissingChunk, [ symbolName ]);
+        }
+        if (!containerEl) {
+            throw qError(QError.qrlMissingContainer, [ url, symbolName ]);
+        }
+        const urlDoc = toUrl(containerEl.ownerDocument, containerEl, url).toString();
+        const urlCopy = new URL(urlDoc);
+        urlCopy.hash = "";
+        return import(urlCopy.href).then((mod => mod[symbolName]));
+    },
+    raf: fn => new Promise((resolve => {
+        requestAnimationFrame((() => {
+            resolve(fn());
+        }));
+    })),
+    nextTick: fn => new Promise((resolve => {
+        setTimeout((() => {
+            resolve(fn());
+        }));
+    })),
+    chunkForSymbol: (symbolName, chunk) => [ symbolName, chunk ?? "_" ]
+});
+
+const toUrl = (doc, containerEl, url) => {
+    const baseURI = doc.baseURI;
+    const base = new URL(containerEl.getAttribute("q:base") ?? baseURI, baseURI);
+    return new URL(url, base);
+};
+
+let _platform = /*#__PURE__ */ createPlatform();
+
+const setPlatform = plt => _platform = plt;
+
+const getPlatform = () => _platform;
+
+const isServerPlatform = () => _platform.isServer;
+
+const isNode = value => value && "number" == typeof value.nodeType;
+
+const isDocument = value => 9 === value.nodeType;
+
+const isElement$1 = value => 1 === value.nodeType;
+
+const MAX_RETRY_ON_PROMISE_COUNT = 100;
+
+const isPromise = value => !!value && "object" == typeof value && "function" == typeof value.then;
+
+const safeCall = (call, thenFn, rejectFn) => {
+    try {
+        const result = call();
+        return isPromise(result) ? result.then(thenFn, rejectFn) : thenFn(result);
+    } catch (e) {
+        return rejectFn(e);
+    }
+};
+
+const maybeThen = (valueOrPromise, thenFn) => isPromise(valueOrPromise) ? valueOrPromise.then(thenFn, shouldNotError) : thenFn(valueOrPromise);
+
+const shouldNotError = reason => {
+    throwErrorAndStop(reason);
+};
+
+const delay = timeout => new Promise((resolve => {
+    setTimeout(resolve, timeout);
+}));
+
+function retryOnPromise(fn, retryCount = 0) {
+    const retryOrThrow = e => {
+        if (isPromise(e) && retryCount < 100) {
+            return e.then(retryOnPromise.bind(null, fn, retryCount++));
+        }
+        throw e;
+    };
+    try {
+        const result = fn();
+        return isPromise(result) ? result.catch((e => retryOrThrow(e))) : result;
+    } catch (e) {
+        return retryOrThrow(e);
+    }
+}
+
+const isSerializableObject = v => {
+    const proto = Object.getPrototypeOf(v);
+    return proto === Object.prototype || proto === Array.prototype || null === proto;
+};
+
+const isObject = v => !!v && "object" == typeof v;
+
+const isArray = v => Array.isArray(v);
+
+const isString = v => "string" == typeof v;
+
+const isFunction = v => "function" == typeof v;
+
+var VNodeDataFlag;
+
 let _locale;
 
 function getLocale(defaultLocale) {
@@ -386,7 +398,13 @@ function setLocale(locale) {
     _locale = locale;
 }
 
-const isQrl$1 = value => "function" == typeof value && "function" == typeof value.getSymbol;
+!function(VNodeDataFlag) {
+    VNodeDataFlag[VNodeDataFlag.NONE = 0] = "NONE", VNodeDataFlag[VNodeDataFlag.TEXT_DATA = 1] = "TEXT_DATA", 
+    VNodeDataFlag[VNodeDataFlag.VIRTUAL_NODE = 2] = "VIRTUAL_NODE", VNodeDataFlag[VNodeDataFlag.ELEMENT_NODE = 4] = "ELEMENT_NODE", 
+    VNodeDataFlag[VNodeDataFlag.REFERENCE = 8] = "REFERENCE", VNodeDataFlag[VNodeDataFlag.SERIALIZE = 16] = "SERIALIZE";
+}(VNodeDataFlag || (VNodeDataFlag = {}));
+
+const isQrl = value => "function" == typeof value && "function" == typeof value.getSymbol;
 
 const EMPTY_ARRAY = [];
 
@@ -431,14 +449,14 @@ const qrl = (chunkOrFn, symbol, lexicalScopeCapture = EMPTY_ARRAY, stackOffset =
         chunk = chunkOrFn;
     }
     return announcedQRL.has(symbol) || (announcedQRL.add(symbol), emitEvent("qprefetch", {
-        symbols: [ getSymbolHash(symbol) ],
+        symbols: [ symbol ],
         bundles: chunk && [ chunk ]
-    })), createQRL(chunk, symbol, null, symbolFn, null, lexicalScopeCapture, null);
+    })), createQRL(chunk, symbol, null, symbolFn, null, lexicalScopeCapture);
 };
 
-const inlinedQrl = (symbol, symbolName, lexicalScopeCapture = EMPTY_ARRAY) => createQRL(null, symbolName, symbol, null, null, lexicalScopeCapture, null);
+const inlinedQrl = (symbol, symbolName, lexicalScopeCapture = EMPTY_ARRAY) => createQRL(null, symbolName, symbol, null, null, lexicalScopeCapture);
 
-const _noopQrl = (symbolName, lexicalScopeCapture = EMPTY_ARRAY) => createQRL(null, symbolName, null, null, null, lexicalScopeCapture, null);
+const _noopQrl = (symbolName, lexicalScopeCapture = EMPTY_ARRAY) => createQRL(null, symbolName, null, null, null, lexicalScopeCapture);
 
 const _noopQrlDEV = (symbolName, opts, lexicalScopeCapture = EMPTY_ARRAY) => {
     const newQrl = _noopQrl(symbolName, lexicalScopeCapture);
@@ -458,6 +476,43 @@ const inlinedQrlDEV = (symbol, symbolName, opts, lexicalScopeCapture = EMPTY_ARR
 const _regSymbol = (symbol, hash) => (void 0 === globalThis.__qwik_reg_symbols && (globalThis.__qwik_reg_symbols = new Map), 
 globalThis.__qwik_reg_symbols.set(hash, symbol), symbol);
 
+var ChoreType;
+
+!function(ChoreType) {
+    ChoreType[ChoreType.MACRO = 240] = "MACRO", ChoreType[ChoreType.MICRO = 15] = "MICRO", 
+    ChoreType[ChoreType.QRL_RESOLVE = 1] = "QRL_RESOLVE", ChoreType[ChoreType.RUN_QRL = 2] = "RUN_QRL", 
+    ChoreType[ChoreType.TASK = 3] = "TASK", ChoreType[ChoreType.NODE_DIFF = 4] = "NODE_DIFF", 
+    ChoreType[ChoreType.NODE_PROP = 5] = "NODE_PROP", ChoreType[ChoreType.COMPONENT = 6] = "COMPONENT", 
+    ChoreType[ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS = 7] = "RECOMPUTE_AND_SCHEDULE_EFFECTS", 
+    ChoreType[ChoreType.JOURNAL_FLUSH = 16] = "JOURNAL_FLUSH", ChoreType[ChoreType.VISIBLE = 32] = "VISIBLE", 
+    ChoreType[ChoreType.CLEANUP_VISIBLE = 48] = "CLEANUP_VISIBLE", ChoreType[ChoreType.WAIT_FOR_ALL = 255] = "WAIT_FOR_ALL";
+}(ChoreType || (ChoreType = {}));
+
+const useLexicalScope = () => {
+    const context = getInvokeContext();
+    let qrl = context.$qrl$;
+    if (qrl) {
+        assertQrl(qrl), assertDefined(qrl.$captureRef$, "invoke: qrl $captureRef$ must be defined inside useLexicalScope()", qrl);
+    } else {
+        const el = context.$element$;
+        assertDefined(el, "invoke: element must be defined inside useLexicalScope()", context);
+        const containerElement = _getQContainerElement(el);
+        assertDefined(containerElement, "invoke: cant find parent q:container of", el);
+        qrl = getDomContainer(containerElement).parseQRL(decodeURIComponent(String(context.$url$)));
+    }
+    return qrl.$captureRef$;
+};
+
+const queueQRL = (...args) => {
+    const [runQrl] = useLexicalScope();
+    const hostElement = getInvokeContext().$hostElement$;
+    const scheduler = getDomContainer(hostElement).$scheduler$;
+    if (!scheduler) {
+        throw qError(QError.schedulerNotFound);
+    }
+    return scheduler(ChoreType.RUN_QRL, hostElement, runQrl, args);
+};
+
 const Slot = props => _jsxSorted(Virtual, null, {
     [QSlotS]: ""
 }, props.children, 0, props.name ?? "");
@@ -536,13 +591,54 @@ function isPreventDefault(key) {
     return key.startsWith("preventdefault:");
 }
 
-const unitlessNumbers = new Set([ "animationIterationCount", "aspectRatio", "borderImageOutset", "borderImageSlice", "borderImageWidth", "boxFlex", "boxFlexGroup", "boxOrdinalGroup", "columnCount", "columns", "flex", "flexGrow", "flexShrink", "gridArea", "gridRow", "gridRowEnd", "gridRowStart", "gridColumn", "gridColumnEnd", "gridColumnStart", "fontWeight", "lineClamp", "lineHeight", "opacity", "order", "orphans", "scale", "tabSize", "widows", "zIndex", "zoom", "MozAnimationIterationCount", "MozBoxFlex", "msFlex", "msFlexPositive", "WebkitAnimationIterationCount", "WebkitBoxFlex", "WebkitBoxOrdinalGroup", "WebkitColumnCount", "WebkitColumns", "WebkitFlex", "WebkitFlexGrow", "WebkitFlexShrink", "WebkitLineClamp" ]);
+function getFileLocationFromJsx(jsxDev) {
+    if (!jsxDev) {
+        return null;
+    }
+    const sanitizedFileName = jsxDev.fileName?.replace(/\\/g, "/");
+    return sanitizedFileName ? `${sanitizedFileName}:${jsxDev.lineNumber}:${jsxDev.columnNumber}` : null;
+}
 
-const isUnitlessNumber = name => unitlessNumbers.has(name);
+const styleContent = styleId => "⚡️" + styleId;
 
-const hashCode = (text, hash = 0) => {
-    for (let i = 0; i < text.length; i++) {
-        hash = (hash << 5) - hash + text.charCodeAt(i), hash |= 0;
+function hasClassAttr(props) {
+    for (const key in props) {
+        if (Object.prototype.hasOwnProperty.call(props, key) && isClassAttr(key)) {
+            return !0;
+        }
+    }
+    return !1;
+}
+
+function isClassAttr(key) {
+    return "class" === key || "className" === key;
+}
+
+function convertScopedStyleIdsToArray(scopedStyleIds) {
+    return scopedStyleIds?.split(" ") ?? null;
+}
+
+function convertStyleIdsToString(scopedStyleIds) {
+    return Array.from(scopedStyleIds).join(" ");
+}
+
+const addComponentStylePrefix = styleId => {
+    if (styleId) {
+        let idx = 0;
+        do {
+            styleId = styleId.substring(0, idx) + styleContent(styleId.substring(idx));
+        } while (0 !== (idx = styleId.indexOf(" ", idx) + 1));
+    }
+    return styleId || null;
+};
+
+const unitlessNumbers = new Set([ "animationIterationCount", "aspectRatio", "borderImageOutset", "borderImageSlice", "borderImageWidth", "boxFlex", "boxFlexGroup", "boxOrdinalGroup", "columnCount", "columns", "flex", "flexGrow", "flexShrink", "gridArea", "gridRow", "gridRowEnd", "gridRowStart", "gridColumn", "gridColumnEnd", "gridColumnStart", "fontWeight", "lineClamp", "lineHeight", "opacity", "order", "orphans", "scale", "tabSize", "widows", "zIndex", "zoom", "MozAnimationIterationCount", "MozBoxFlex", "msFlex", "msFlexPositive", "WebkitAnimationIterationCount", "WebkitBoxFlex", "WebkitBoxOrdinalGroup", "WebkitColumnCount", "WebkitColumns", "WebkitFlex", "WebkitFlexGrow", "WebkitFlexShrink", "WebkitLineClamp" ]);
+
+const isUnitlessNumber = name => unitlessNumbers.has(name);
+
+const hashCode = (text, hash = 0) => {
+    for (let i = 0; i < text.length; i++) {
+        hash = (hash << 5) - hash + text.charCodeAt(i), hash |= 0;
     }
     return Number(Math.abs(hash)).toString(36);
 };
@@ -616,39 +712,6 @@ function isAriaAttribute(prop) {
 
 const styleKey = (qStyles, index) => (assertQrl(qStyles), `${hashCode(qStyles.$hash$)}-${index}`);
 
-const styleContent = styleId => "⭐️" + styleId;
-
-function hasClassAttr(props) {
-    for (const key in props) {
-        if (Object.prototype.hasOwnProperty.call(props, key) && isClassAttr(key)) {
-            return !0;
-        }
-    }
-    return !1;
-}
-
-function isClassAttr(key) {
-    return "class" === key || "className" === key;
-}
-
-function convertScopedStyleIdsToArray(scopedStyleIds) {
-    return scopedStyleIds?.split(" ") ?? null;
-}
-
-function convertStyleIdsToString(scopedStyleIds) {
-    return Array.from(scopedStyleIds).join(" ");
-}
-
-const addComponentStylePrefix = styleId => {
-    if (styleId) {
-        let idx = 0;
-        do {
-            styleId = styleId.substring(0, idx) + styleContent(styleId.substring(idx));
-        } while (0 !== (idx = styleId.indexOf(" ", idx) + 1));
-    }
-    return styleId || null;
-};
-
 const STORE_TARGET = Symbol("store.target");
 
 const STORE_HANDLER = Symbol("store.handler");
@@ -752,18 +815,19 @@ class StoreHandler {
         Reflect.ownKeys(target);
     }
     getOwnPropertyDescriptor(target, prop) {
-        return Array.isArray(target) || "symbol" == typeof prop ? Object.getOwnPropertyDescriptor(target, prop) : {
+        const descriptor = Reflect.getOwnPropertyDescriptor(target, prop);
+        return Array.isArray(target) || "symbol" == typeof prop || descriptor && !descriptor.configurable ? descriptor : {
             enumerable: !0,
             configurable: !0
         };
     }
 }
 
-function addEffect(target, prop, store, effectSubscriber) {
-    const effectsMap = store.$effects$ ||= {};
-    const effects = Object.prototype.hasOwnProperty.call(effectsMap, prop) && effectsMap[prop] || (effectsMap[prop] = []);
-    ensureContainsEffect(effects, effectSubscriber), ensureContains(effectSubscriber, target), 
-    ensureEffectContainsSubscriber(effectSubscriber[EffectSubscriptionsProp.EFFECT], target, store.$container$);
+function addEffect(target, prop, store, effectSubscription) {
+    const effectsMap = store.$effects$ ||= new Map;
+    let effects = effectsMap.get(prop);
+    effects || (effects = new Set, effectsMap.set(prop, effects)), ensureContainsSubscription(effects, effectSubscription), 
+    ensureContainsBackRef(effectSubscription, target), addQrlToSerializationCtx(effectSubscription, store.$container$);
 }
 
 function setNewValueAndTriggerEffects(prop, value, target, currentStore) {
@@ -771,12 +835,87 @@ function setNewValueAndTriggerEffects(prop, value, target, currentStore) {
 }
 
 function getEffects(target, prop, storeEffects) {
-    let effectsToTrigger = storeEffects ? Array.isArray(target) ? Object.values(storeEffects).flatMap((effects => effects)) : storeEffects[prop] : null;
-    const storeArrayValue = storeEffects?.[STORE_ARRAY_PROP];
-    return storeArrayValue && (effectsToTrigger ||= [], effectsToTrigger.push(...storeArrayValue)), 
-    effectsToTrigger;
+    let effectsToTrigger;
+    if (storeEffects) {
+        if (Array.isArray(target)) {
+            for (const effects of storeEffects.values()) {
+                effectsToTrigger ||= new Set;
+                for (const effect of effects) {
+                    effectsToTrigger.add(effect);
+                }
+            }
+        } else {
+            effectsToTrigger = storeEffects.get(prop);
+        }
+    }
+    const storeArrayValue = storeEffects?.get(STORE_ARRAY_PROP);
+    if (storeArrayValue) {
+        effectsToTrigger ||= new Set;
+        for (const effect of storeArrayValue) {
+            effectsToTrigger.add(effect);
+        }
+    }
+    return effectsToTrigger || null;
+}
+
+const NEEDS_COMPUTATION = Symbol("invalid");
+
+const _EFFECT_BACK_REF = Symbol("backRef");
+
+class BackRef {
+    [_EFFECT_BACK_REF]=null;
+}
+
+function clearAllEffects(container, consumer) {
+    vnode_isVNode(consumer) && vnode_isElementVNode(consumer) && ensureMaterialized(consumer);
+    const effects = consumer[_EFFECT_BACK_REF];
+    if (effects) {
+        for (const [, effect] of effects) {
+            const backRefs = effect[EffectSubscriptionProp.BACK_REF];
+            if (!backRefs) {
+                return;
+            }
+            for (const producer of backRefs) {
+                if (producer instanceof Signal) {
+                    clearSignal(container, producer, effect);
+                } else if (container.$storeProxyMap$.has(producer)) {
+                    const target = container.$storeProxyMap$.get(producer);
+                    clearStore(getStoreHandler(target), effect);
+                }
+            }
+        }
+    }
+}
+
+function clearSignal(container, producer, effect) {
+    const effects = producer.$effects$;
+    effects && effects.delete(effect), producer instanceof WrappedSignal && (producer.$hostElement$ = null, 
+    clearAllEffects(container, producer));
+}
+
+function clearStore(producer, effect) {
+    const effects = producer?.$effects$;
+    if (effects) {
+        for (const propEffects of effects.values()) {
+            propEffects.delete(effect);
+        }
+    }
 }
 
+const implicit$FirstArg = fn => function(first, ...rest) {
+    return fn.call(null, dollar(first), ...rest);
+};
+
+const createSignal$1 = value => new Signal(null, value);
+
+const createComputedSignal = qrl => (throwIfQRLNotResolved(qrl), new ComputedSignal(null, qrl));
+
+const createSignal = createSignal$1;
+
+const createComputedQrl = createComputedSignal;
+
+const createComputed$ = /*#__PURE__*/ implicit$FirstArg(createComputedQrl);
+
 const useSequentialScope = () => {
     const iCtx = useInvokeContext();
     const host = iCtx.$hostElement$;
@@ -794,235 +933,123 @@ const useSequentialScope = () => {
     };
 };
 
-class Subscriber {
-    $effectDependencies$=null;
+function getSubscriber(effect, prop, data) {
+    effect[_EFFECT_BACK_REF] || (isServer && isSsrNode(effect) ? effect.setProp("q:brefs", new Map) : effect[_EFFECT_BACK_REF] = new Map);
+    const subMap = effect[_EFFECT_BACK_REF];
+    let sub = subMap.get(prop);
+    return sub || (sub = [ effect, prop ], subMap.set(prop, sub)), data && (sub[EffectSubscriptionProp.DATA] = data), 
+    sub;
 }
 
-function isSubscriber(value) {
-    return value instanceof Subscriber || value instanceof WrappedSignal;
+function isSsrNode(value) {
+    return "__brand__" in value && "currentComponentNode" in value;
 }
 
-function clearVNodeEffectDependencies(container, value) {
-    vnode_isElementVNode(value) && ensureMaterialized(value);
-    const effects = vnode_getProp(value, "q:subs", container.$getObjectById$);
-    if (effects) {
-        for (let i = effects.length - 1; i >= 0; i--) {
-            clearEffects(effects[i], value, effects, i, container);
-        }
-        0 === effects.length && vnode_setProp(value, "q:subs", null);
-    }
-}
+var TaskFlags;
 
-function clearSubscriberEffectDependencies(container, value) {
-    if (value.$effectDependencies$) {
-        for (let i = value.$effectDependencies$.length - 1; i >= 0; i--) {
-            clearEffects(value.$effectDependencies$[i], value, value.$effectDependencies$, i, container);
-        }
-        0 === value.$effectDependencies$.length && (value.$effectDependencies$ = null);
-    }
-}
+!function(TaskFlags) {
+    TaskFlags[TaskFlags.VISIBLE_TASK = 1] = "VISIBLE_TASK", TaskFlags[TaskFlags.TASK = 2] = "TASK", 
+    TaskFlags[TaskFlags.RESOURCE = 4] = "RESOURCE", TaskFlags[TaskFlags.DIRTY = 8] = "DIRTY";
+}(TaskFlags || (TaskFlags = {}));
 
-function clearEffects(subscriber, value, effectArray, indexToRemove, container) {
-    let subscriptionRemoved = !1;
-    const seenSet = new Set;
-    if (subscriber instanceof WrappedSignal) {
-        subscriptionRemoved = clearSignalEffects(subscriber, value, seenSet);
-    } else if (container.$storeProxyMap$.has(subscriber)) {
-        const store = container.$storeProxyMap$.get(subscriber);
-        subscriptionRemoved = clearStoreEffects(getStoreHandler(store), value);
+const useTaskQrl = qrl => {
+    const {val, set, iCtx, i} = useSequentialScope();
+    if (val) {
+        return;
     }
-    subscriptionRemoved && effectArray.splice(indexToRemove, 1);
-}
+    assertQrl(qrl), set(1);
+    const task = new Task(TaskFlags.DIRTY | TaskFlags.TASK, i, iCtx.$hostElement$, qrl, void 0, null);
+    set(task);
+    const promise = iCtx.$container$.$scheduler$(ChoreType.TASK, task);
+    isPromise(promise) && promise.catch((() => {}));
+};
 
-function clearSignalEffects(subscriber, value, seenSet) {
-    const effectSubscriptions = subscriber.$effects$;
-    let subscriptionRemoved = !1;
-    if (effectSubscriptions) {
-        for (let i = effectSubscriptions.length - 1; i >= 0; i--) {
-            effectSubscriptions[i][EffectSubscriptionsProp.EFFECT] === value && (effectSubscriptions.splice(i, 1), 
-            subscriptionRemoved = !0);
+const runTask = (task, container, host) => {
+    task.$flags$ &= ~TaskFlags.DIRTY, cleanupTask(task);
+    const iCtx = newInvokeContext(container.$locale$, host, void 0, "qTask");
+    iCtx.$container$ = container;
+    const taskFn = task.$qrl$.getFn(iCtx, (() => clearAllEffects(container, task)));
+    let cleanupFns = null;
+    const cleanup = fn => {
+        "function" == typeof fn && (cleanupFns || (cleanupFns = [], task.$destroy$ = noSerialize((() => {
+            task.$destroy$ = null, cleanupFns.forEach((fn => {
+                try {
+                    fn();
+                } catch (err) {
+                    container.handleError(err, host);
+                }
+            }));
+        }))), cleanupFns.push(fn));
+    };
+    const taskApi = {
+        track: (obj, prop) => {
+            const ctx = newInvokeContext();
+            return ctx.$effectSubscriber$ = getSubscriber(task, EffectProperty.COMPONENT), ctx.$container$ = container, 
+            invoke(ctx, (() => {
+                if (isFunction(obj)) {
+                    return obj();
+                }
+                if (prop) {
+                    return obj[prop];
+                }
+                if (isSignal(obj)) {
+                    return obj.value;
+                }
+                throw qError(QError.trackObjectWithoutProp);
+            }));
+        },
+        cleanup
+    };
+    return safeCall((() => taskFn(taskApi)), cleanup, (err => {
+        if (isPromise(err)) {
+            return err.then((() => runTask(task, container, host)));
         }
-    }
-    if (subscriber instanceof WrappedSignal) {
-        const hostElement = subscriber.$hostElement$;
-        hostElement && hostElement === value && (subscriber.$hostElement$ = null);
-        const args = subscriber.$args$;
-        args && clearArgsEffects(args, subscriber, seenSet);
-    }
-    return subscriptionRemoved;
-}
+        throw err;
+    }));
+};
 
-function clearStoreEffects(storeHandler, value) {
-    const effectSubscriptions = storeHandler.$effects$;
-    if (!effectSubscriptions) {
-        return !1;
-    }
-    let subscriptionRemoved = !1;
-    for (const key in effectSubscriptions) {
-        const effects = effectSubscriptions[key];
-        for (let i = effects.length - 1; i >= 0; i--) {
-            effects[i][EffectSubscriptionsProp.EFFECT] === value && (effects.splice(i, 1), subscriptionRemoved = !0);
+const cleanupTask = task => {
+    const destroy = task.$destroy$;
+    if (destroy) {
+        task.$destroy$ = null;
+        try {
+            destroy();
+        } catch (err) {
+            logError(err);
         }
-        0 === effects.length && delete effectSubscriptions[key];
     }
-    return subscriptionRemoved;
-}
+};
 
-function clearArgsEffects(args, subscriber, seenSet) {
-    for (let i = args.length - 1; i >= 0; i--) {
-        clearArgEffect(args[i], subscriber, seenSet);
+class Task extends BackRef {
+    $flags$;
+    $index$;
+    $el$;
+    $qrl$;
+    $state$;
+    $destroy$;
+    constructor($flags$, $index$, $el$, $qrl$, $state$, $destroy$) {
+        super(), this.$flags$ = $flags$, this.$index$ = $index$, this.$el$ = $el$, this.$qrl$ = $qrl$, 
+        this.$state$ = $state$, this.$destroy$ = $destroy$;
     }
 }
 
-function clearArgEffect(arg, subscriber, seenSet) {
-    if (!seenSet.has(arg)) {
-        if (seenSet.add(arg), isSignal(arg)) {
-            clearSignalEffects(arg, subscriber, seenSet);
-        } else if ("object" == typeof arg && null !== arg) {
-            if (isStore(arg)) {
-                clearStoreEffects(getStoreHandler(arg), subscriber);
-            } else {
-                for (const key in arg) {
-                    clearArgEffect(arg[key], subscriber, seenSet);
-                }
-            }
-        } else {
-            Array.isArray(arg) && clearArgsEffects(arg, subscriber, seenSet);
-        }
-    }
-}
+const isTask = value => value instanceof Task;
 
-const useResourceQrl = (qrl, opts) => {
-    const {val, set, i, iCtx} = useSequentialScope();
-    if (null != val) {
-        return val;
-    }
-    assertQrl(qrl);
-    const container = iCtx.$container$;
-    const resource = createResourceReturn(container, opts);
-    const task = new Task(TaskFlags.DIRTY | TaskFlags.RESOURCE, i, iCtx.$hostElement$, qrl, resource, null);
-    return runResource(task, container, iCtx.$hostElement$), set(resource), resource;
+const scheduleTask = (_event, element) => {
+    const [task] = useLexicalScope();
+    const type = task.$flags$ & TaskFlags.VISIBLE_TASK ? ChoreType.VISIBLE : ChoreType.TASK;
+    getDomContainer(element).$scheduler$(type, task);
 };
 
-const Resource = props => _jsxSorted(Fragment, null, null, getResourceValueAsPromise(props), 0, null);
+var VNodeFlags;
 
-function getResourceValueAsPromise(props) {
-    const resource = props.value;
-    if (isResourceReturn(resource)) {
-        if (!isServerPlatform()) {
-            const state = resource._state;
-            if ("pending" === state && props.onPending) {
-                return Promise.resolve().then(useBindInvokeContext(props.onPending));
-            }
-            if ("rejected" === state && props.onRejected) {
-                return Promise.resolve(resource._error).then(useBindInvokeContext(props.onRejected));
-            }
-            {
-                const resolvedValue = untrack((() => resource._resolved));
-                if (void 0 !== resolvedValue) {
-                    return Promise.resolve(resolvedValue).then(useBindInvokeContext(props.onResolved));
-                }
-            }
-        }
-        return resource.value.then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
-    }
-    return isPromise(resource) ? resource.then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected)) : isSignal(resource) ? Promise.resolve(resource.value).then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected)) : Promise.resolve(resource).then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
-}
+var VNodeFlagsIndex;
 
-const _createResourceReturn = opts => ({
-    __brand: "resource",
-    value: void 0,
-    loading: !isServerPlatform(),
-    _resolved: void 0,
-    _error: void 0,
-    _state: "pending",
-    _timeout: opts?.timeout ?? -1,
-    _cache: 0
-});
+var VNodeProps;
 
-const createResourceReturn = (container, opts, initialPromise) => {
-    const result = _createResourceReturn(opts);
-    return result.value = initialPromise, createStore(container, result, StoreFlags.RECURSIVE);
-};
+var ElementVNodeProps;
 
-const isResourceReturn = obj => isObject(obj) && "resource" === (getStoreTarget(obj) || obj).__brand;
-
-const runResource = (task, container, host) => {
-    task.$flags$ &= ~TaskFlags.DIRTY, cleanupTask(task);
-    const iCtx = newInvokeContext(container.$locale$, host, void 0, "qResource");
-    iCtx.$container$ = container;
-    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(container, task)));
-    const resource = task.$state$;
-    assertDefined(resource, 'useResource: when running a resource, "task.resource" must be a defined.', task);
-    const cleanups = [];
-    task.$destroy$ = noSerialize((() => {
-        cleanups.forEach((fn => {
-            try {
-                fn();
-            } catch (err) {
-                container.handleError(err, host);
-            }
-        })), done = !0;
-    }));
-    const resourceTarget = unwrapStore(resource);
-    const opts = {
-        track: (obj, prop) => {
-            const ctx = newInvokeContext();
-            return ctx.$effectSubscriber$ = [ task, EffectProperty.COMPONENT ], ctx.$container$ = container, 
-            invoke(ctx, (() => isFunction(obj) ? obj() : prop ? obj[prop] : isSignal(obj) ? obj.value : obj));
-        },
-        cleanup(fn) {
-            "function" == typeof fn && cleanups.push(fn);
-        },
-        cache(policy) {
-            let milliseconds = 0;
-            milliseconds = "immutable" === policy ? 1 / 0 : policy, resource._cache = milliseconds;
-        },
-        previous: resourceTarget._resolved
-    };
-    let resolve;
-    let reject;
-    let done = !1;
-    const setState = (resolved, value) => !done && (done = !0, resolved ? (done = !0, 
-    resource.loading = !1, resource._state = "resolved", resource._resolved = value, 
-    resource._error = void 0, resolve(value)) : (done = !0, resource.loading = !1, resource._state = "rejected", 
-    resource._error = value, reject(value)), !0);
-    cleanups.push((() => {
-        if (!0 === untrack((() => resource.loading))) {
-            const value = untrack((() => resource._resolved));
-            setState(!0, value);
-        }
-    })), invoke(iCtx, (() => {
-        resource._state = "pending", resource.loading = !isServerPlatform();
-        (resource.value = new Promise(((r, re) => {
-            resolve = r, reject = re;
-        }))).catch(ignoreErrorToPreventNodeFromCrashing);
-    }));
-    const promise = safeCall((() => Promise.resolve(taskFn(opts))), (value => {
-        setState(!0, value);
-    }), (err => {
-        if (isPromise(err)) {
-            return err.then((() => runResource(task, container, host)));
-        }
-        setState(!1, err);
-    }));
-    const timeout = resourceTarget._timeout;
-    return timeout > 0 ? Promise.race([ promise, delay(timeout).then((() => {
-        setState(!1, new Error("timeout")) && cleanupTask(task);
-    })) ]) : promise;
-};
-
-const ignoreErrorToPreventNodeFromCrashing = () => {};
-
-var VNodeFlags;
-
-var VNodeFlagsIndex;
-
-var VNodeProps;
-
-var ElementVNodeProps;
-
-var TextVNodeProps;
+var TextVNodeProps;
 
 var VirtualVNodeProps;
 
@@ -1053,7 +1080,32 @@ var VirtualVNodeProps;
     VirtualVNodeProps[VirtualVNodeProps.PROPS_OFFSET = 6] = "PROPS_OFFSET";
 }(VirtualVNodeProps || (VirtualVNodeProps = {}));
 
-const isForeignObjectElement = elementName => "foreignobject" === elementName.toLowerCase();
+const mapApp_findIndx = (elementVNode, key, start) => {
+    assertTrue(start % 2 == 0, "Expecting even number.");
+    let bottom = start >> 1;
+    let top = elementVNode.length - 2 >> 1;
+    for (;bottom <= top; ) {
+        const mid = bottom + (top - bottom >> 1);
+        const midKey = elementVNode[mid << 1];
+        if (midKey === key) {
+            return mid << 1;
+        }
+        midKey < key ? bottom = mid + 1 : top = mid - 1;
+    }
+    return ~(bottom << 1);
+};
+
+const mapArray_set = (elementVNode, key, value, start) => {
+    const indx = mapApp_findIndx(elementVNode, key, start);
+    indx >= 0 ? null == value ? elementVNode.splice(indx, 2) : elementVNode[indx + 1] = value : null != value && elementVNode.splice(~indx, 0, key, value);
+};
+
+const mapArray_get = (elementVNode, key, start) => {
+    const indx = mapApp_findIndx(elementVNode, key, start);
+    return indx >= 0 ? elementVNode[indx + 1] : null;
+};
+
+const isForeignObjectElement = elementName => isDev ? "foreignobject" === elementName.toLowerCase() : "foreignObject" === elementName;
 
 const isSvgElement = elementName => "svg" === elementName || isForeignObjectElement(elementName);
 
@@ -1061,7 +1113,18 @@ const isMathElement = elementName => "math" === elementName;
 
 const vnode_isDefaultNamespace = vnode => !(vnode[VNodeProps.flags] & VNodeFlags.NAMESPACE_MASK);
 
-const vnode_getElementNamespaceFlags = elementName => isSvgElement(elementName) ? VNodeFlags.NS_svg : isMathElement(elementName) ? VNodeFlags.NS_math : VNodeFlags.NS_html;
+const vnode_getElementNamespaceFlags = element => {
+    switch (fastNamespaceURI(element)) {
+      case SVG_NS:
+        return VNodeFlags.NS_svg;
+
+      case MATH_NS:
+        return VNodeFlags.NS_math;
+
+      default:
+        return VNodeFlags.NS_html;
+    }
+};
 
 function vnode_getDomChildrenWithCorrectNamespacesToInsert(journal, domParentVNode, newChild) {
     const {elementNamespace, elementNamespaceFlag} = getNewElementNamespaceData(domParentVNode, newChild);
@@ -1232,14 +1295,14 @@ const useOnEventsSequentialScope = () => {
 };
 
 const executeComponent = (container, renderHost, subscriptionHost, componentQRL, props) => {
-    const iCtx = newInvokeContext(container.$locale$, subscriptionHost, void 0, "qRender");
+    const iCtx = newInvokeContext(container.$locale$, subscriptionHost || void 0, void 0, "qRender");
     let componentFn;
-    iCtx.$effectSubscriber$ = [ subscriptionHost, EffectProperty.COMPONENT ], iCtx.$container$ = container, 
-    container.ensureProjectionResolved(renderHost);
+    subscriptionHost && (iCtx.$effectSubscriber$ = getSubscriber(subscriptionHost, EffectProperty.COMPONENT), 
+    iCtx.$container$ = container), container.ensureProjectionResolved(renderHost);
     let isInlineComponent = !1;
-    if (null === componentQRL && assertDefined(componentQRL = componentQRL || container.getHostProp(renderHost, "q:renderFn"), "No Component found at this location"), 
-    isQrl(componentQRL)) {
-        (props = props || container.getHostProp(renderHost, "q:props") || EMPTY_OBJ) && props.children && delete props.children, 
+    if (null === componentQRL && assertDefined(componentQRL = container.getHostProp(renderHost, "q:renderFn"), "No Component found at this location"), 
+    isQrl$1(componentQRL)) {
+        (props = props || container.getHostProp(renderHost, "q:props") || EMPTY_OBJ).children && delete props.children, 
         componentFn = componentQRL.getFn(iCtx);
     } else if (isQwikComponent(componentQRL)) {
         const qComponentFn = componentQRL;
@@ -1250,11 +1313,10 @@ const executeComponent = (container, renderHost, subscriptionHost, componentQRL,
         componentFn = () => invokeApply(iCtx, inlineComponent, [ props || EMPTY_OBJ ]);
     }
     const executeComponentWithPromiseExceptionRetry = (retryCount = 0) => safeCall((() => (isInlineComponent || (container.setHostProp(renderHost, "q:seqIdx", null), 
-    container.setHostProp(renderHost, ":onIdx", null), container.getHostProp(renderHost, "q:props") !== props && container.setHostProp(renderHost, "q:props", props)), 
-    vnode_isVNode(renderHost) && clearVNodeEffectDependencies(container, renderHost), 
-    componentFn(props))), (jsx => {
+    container.setHostProp(renderHost, ":onIdx", null), container.setHostProp(renderHost, "q:props", props)), 
+    vnode_isVNode(renderHost) && clearAllEffects(container, renderHost), componentFn(props))), (jsx => {
         const useOnEvents = container.getHostProp(renderHost, ":on");
-        return useOnEvents ? maybeThen(addUseOnEvents(jsx, useOnEvents), (() => jsx)) : jsx;
+        return useOnEvents ? addUseOnEvents(jsx, useOnEvents) : jsx;
     }), (err => {
         if (isPromise(err) && retryCount < 100) {
             return err.then((() => executeComponentWithPromiseExceptionRetry(retryCount++)));
@@ -1266,13 +1328,28 @@ const executeComponent = (container, renderHost, subscriptionHost, componentQRL,
 
 function addUseOnEvents(jsx, useOnEvents) {
     const jsxElement = findFirstStringJSX(jsx);
+    let jsxResult = jsx;
     return maybeThen(jsxElement, (jsxElement => {
         let isInvisibleComponent = !1;
         jsxElement || (isInvisibleComponent = !0);
         for (const key in useOnEvents) {
-            Object.prototype.hasOwnProperty.call(useOnEvents, key) && (isInvisibleComponent ? "onQvisible$" === key ? (jsxElement = addScriptNodeForInvisibleComponents(jsx)) && addUseOnEvent(jsxElement, "document:onQinit$", useOnEvents[key]) : key.startsWith("document:") || key.startsWith("window:") ? (jsxElement = addScriptNodeForInvisibleComponents(jsx)) && addUseOnEvent(jsxElement, key, useOnEvents[key]) : isDev && logWarn('You are trying to add an event "' + key + '" using `useOn` hook, but a node to which you can add an event is not found. Please make sure that the component has a valid element node. ') : jsxElement && addUseOnEvent(jsxElement, key, useOnEvents[key]));
+            if (Object.prototype.hasOwnProperty.call(useOnEvents, key)) {
+                if (isInvisibleComponent) {
+                    if ("onQvisible$" === key) {
+                        const [jsxElement, jsx] = addScriptNodeForInvisibleComponents(jsxResult);
+                        jsxResult = jsx, jsxElement && addUseOnEvent(jsxElement, "document:onQinit$", useOnEvents[key]);
+                    } else if (key.startsWith("document:") || key.startsWith("window:")) {
+                        const [jsxElement, jsx] = addScriptNodeForInvisibleComponents(jsxResult);
+                        jsxResult = jsx, jsxElement && addUseOnEvent(jsxElement, key, useOnEvents[key]);
+                    } else {
+                        isDev && logWarn('You are trying to add an event "' + key + '" using `useOn` hook, but a node to which you can add an event is not found. Please make sure that the component has a valid element node. ');
+                    }
+                } else {
+                    jsxElement && addUseOnEvent(jsxElement, key, useOnEvents[key]);
+                }
+            }
         }
-        return jsxElement;
+        return jsxResult;
     }));
 }
 
@@ -1313,12 +1390,22 @@ function addScriptNodeForInvisibleComponents(jsx) {
             type: "placeholder",
             hidden: ""
         }, null, 3);
-        return null == jsx.children ? jsx.children = jsxElement : Array.isArray(jsx.children) ? jsx.children.push(jsxElement) : jsx.children = [ jsx.children, jsxElement ], 
-        jsxElement;
+        return jsx.type === Slot ? [ jsxElement, _jsxSorted(Fragment, null, null, [ jsx, jsxElement ], 0, null) ] : (null == jsx.children ? jsx.children = jsxElement : Array.isArray(jsx.children) ? jsx.children.push(jsxElement) : jsx.children = [ jsx.children, jsxElement ], 
+        [ jsxElement, jsx ]);
+    }
+    if (Array.isArray(jsx) && jsx.length) {
+        const [jsxElement, _] = addScriptNodeForInvisibleComponents(jsx[0]);
+        return [ jsxElement, jsx ];
     }
-    return Array.isArray(jsx) && jsx.length ? addScriptNodeForInvisibleComponents(jsx[0]) : null;
+    return [ null, null ];
 }
 
+const _CONST_PROPS = Symbol("CONST");
+
+const _VAR_PROPS = Symbol("VAR");
+
+const _IMMUTABLE = Symbol("IMMUTABLE");
+
 function isSlotProp(prop) {
     return !prop.startsWith("q:") && !prop.startsWith(":");
 }
@@ -1328,10 +1415,19 @@ function isParentSlotProp(prop) {
 }
 
 const _restProps = (props, omit, target = {}) => {
-    for (const key in props) {
-        omit.includes(key) || (target[key] = props[key]);
+    let constPropsTarget = null;
+    const constProps = props[_CONST_PROPS];
+    if (constProps) {
+        for (const key in constProps) {
+            omit.includes(key) || (constPropsTarget ||= {}, constPropsTarget[key] = constProps[key]);
+        }
     }
-    return target;
+    const varPropsTarget = target;
+    const varProps = props[_VAR_PROPS];
+    for (const key in varProps) {
+        omit.includes(key) || (varPropsTarget[key] = varProps[key]);
+    }
+    return createPropsProxy(varPropsTarget, constPropsTarget);
 };
 
 function escapeHTML(html) {
@@ -1360,14 +1456,6 @@ function escapeHTML(html) {
     return 0 === lastIdx ? html : escapedHTML + html.substring(lastIdx);
 }
 
-function getFileLocationFromJsx(jsxDev) {
-    if (!jsxDev) {
-        return null;
-    }
-    const sanitizedFileName = jsxDev.fileName?.replace(/\\/g, "/");
-    return sanitizedFileName ? `${sanitizedFileName}:${jsxDev.lineNumber}:${jsxDev.columnNumber}` : null;
-}
-
 const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
     let journal = container.$journal$;
     const stack = [];
@@ -1405,7 +1493,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                     if (Array.isArray(jsxValue)) {
                         descend(jsxValue, !1);
                     } else if (isSignal(jsxValue)) {
-                        vCurrent && clearVNodeEffectDependencies(container, vCurrent), expectVirtual(VirtualType.WrappedSignal, null), 
+                        vCurrent && clearAllEffects(container, vCurrent), expectVirtual(VirtualType.WrappedSignal, null), 
                         descend(trackSignalAndAssignHost(jsxValue, vNewNode || vCurrent, EffectProperty.VNODE, container), !0);
                     } else if (isPromise(jsxValue)) {
                         expectVirtual(VirtualType.Awaited, null), asyncQueue.push(jsxValue, vNewNode || vCurrent);
@@ -1544,8 +1632,12 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 if (isJsxPropertyAnEventName(key)) {
                     const eventName = getEventNameFromJsxProp(key);
                     const scope = getEventNameScopeFromJsxProp(key);
-                    vnode_setProp(vNewNode, HANDLER_PREFIX + ":" + scope + ":" + eventName, value), 
-                    eventName && registerQwikLoaderEvent(eventName), needsQDispatchEventPatch = !0;
+                    if (eventName && (vnode_setProp(vNewNode, HANDLER_PREFIX + ":" + scope + ":" + eventName, value), 
+                    registerQwikLoaderEvent(eventName)), scope) {
+                        const htmlEvent = convertEventNameFromJsxPropToHtmlAttr(key);
+                        htmlEvent && vnode_setAttr(journal, vNewNode, htmlEvent, "");
+                    }
+                    needsQDispatchEventPatch = !0;
                 } else {
                     if ("ref" === key) {
                         if (isSignal(value)) {
@@ -1556,10 +1648,13 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                             value(element);
                             continue;
                         }
+                        if (null == value) {
+                            continue;
+                        }
                         throw qError(QError.invalidRefValue, [ currentFile ]);
                     }
                     if (isSignal(value)) {
-                        const signalData = new EffectPropData({
+                        const signalData = new SubscriptionData({
                             $scopedStyleIdPrefix$: scopedStyleIdPrefix,
                             $isConst$: !0
                         });
@@ -1606,10 +1701,10 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
         const vNode = vNewNode || vCurrent;
         if (needsQDispatchEventPatch = function(vnode, srcAttrs, currentFile) {
             vnode_ensureElementInflated(vnode);
-            const dstAttrs = vnode;
+            const dstAttrs = vnode_getProps(vnode);
             let srcIdx = 0;
             const srcLength = srcAttrs.length;
-            let dstIdx = ElementVNodeProps.PROPS_OFFSET;
+            let dstIdx = 0;
             let dstLength = dstAttrs.length;
             let srcKey = srcIdx < srcLength ? srcAttrs[srcIdx++] : null;
             let dstKey = dstIdx < dstLength ? dstAttrs[dstIdx++] : null;
@@ -1626,10 +1721,13 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                         if ("function" == typeof value) {
                             return void value(element);
                         }
+                        if (null == value) {
+                            return;
+                        }
                         throw qError(QError.invalidRefValue, [ currentFile ]);
                     }
                     if (isSignal(value)) {
-                        const signalData = new EffectPropData({
+                        const signalData = new SubscriptionData({
                             $scopedStyleIdPrefix$: scopedStyleIdPrefix,
                             $isConst$: !1
                         });
@@ -1641,12 +1739,12 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             };
             const recordJsxEvent = (key, value) => {
                 const eventName = getEventNameFromJsxProp(key);
-                if (eventName) {
-                    const scope = getEventNameScopeFromJsxProp(key);
-                    record(":" + scope + ":" + eventName, value);
+                const scope = getEventNameScopeFromJsxProp(key);
+                if (eventName && (record(":" + scope + ":" + eventName, value), registerQwikLoaderEvent(eventName)), 
+                scope) {
+                    const htmlEvent = convertEventNameFromJsxPropToHtmlAttr(key);
+                    htmlEvent && record(htmlEvent, "");
                 }
-                const htmlEvent = convertEventNameFromJsxPropToHtmlAttr(key);
-                htmlEvent && record(htmlEvent, ""), eventName && registerQwikLoaderEvent(eventName);
             };
             for (;null !== srcKey || null !== dstKey; ) {
                 if (dstKey?.startsWith(HANDLER_PREFIX) || dstKey?.startsWith("q:")) {
@@ -1678,7 +1776,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 let returnValue = !1;
                 return qrls.flat(2).forEach((qrl => {
                     if (qrl) {
-                        const value = qrl(event, element);
+                        const value = container.$scheduler$(ChoreType.RUN_QRL, vNode, qrl, [ event, element ]);
                         returnValue = returnValue || !0 === value;
                     }
                 })), returnValue;
@@ -1727,8 +1825,8 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             const vNodeComponentHash = getComponentHash(host, container.$getObjectById$);
             const lookupKey = jsxNode.key || componentHash;
             if (lookupKey === (getKey(host) || vNodeComponentHash) ? componentHash === vNodeComponentHash || (insertNewComponent(host, componentQRL, jsxProps), 
-            vNewNode && (host && (vNewNode[VNodeProps.flags] = host[VNodeProps.flags]), host = vNewNode, 
-            shouldRender = !0)) : (vNewNode = retrieveChildWithKey(null, lookupKey), vNewNode ? vnode_insertBefore(journal, vParent, vNewNode, vCurrent) : insertNewComponent(host, componentQRL, jsxProps), 
+            vNewNode && (host = vNewNode, shouldRender = !0)) : (vNewNode = retrieveChildWithKey(null, lookupKey), 
+            vNewNode ? vnode_insertBefore(journal, vParent, vNewNode, vCurrent) : insertNewComponent(host, componentQRL, jsxProps), 
             host = vNewNode, shouldRender = !0), host) {
                 const vNodeProps = vnode_getProp(host, "q:props", container.$getObjectById$);
                 shouldRender = shouldRender || propsDiffer(jsxProps, vNodeProps), shouldRender && (host[VNodeProps.flags] &= ~VNodeFlags.Deleted, 
@@ -1739,8 +1837,9 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 const createProjectionJSXNode = slotName => new JSXNodeImpl(Projection, EMPTY_OBJ, null, [], 0, slotName);
                 const projections = [];
                 if (host) {
-                    for (let i = vnode_getPropStartIndex(host); i < host.length; i += 2) {
-                        const prop = host[i];
+                    const props = vnode_getProps(host);
+                    for (let i = 0; i < props.length; i += 2) {
+                        const prop = props[i];
                         if (isSlotProp(prop)) {
                             const slotName = prop;
                             projections.push(slotName), projections.push(createProjectionJSXNode(slotName));
@@ -1781,7 +1880,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
         }
     }
     function insertNewComponent(host, componentQRL, jsxProps) {
-        host && clearVNodeEffectDependencies(container, host), vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore());
+        host && clearAllEffects(container, host), vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore());
         const jsxNode = jsxValue;
         isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Component), container.setHostProp(vNewNode, "q:renderFn", componentQRL), 
         container.setHostProp(vNewNode, "q:props", jsxProps), container.setHostProp(vNewNode, "q:key", jsxNode.key);
@@ -1814,8 +1913,8 @@ function propsDiffer(src, dst) {
     if (!src || !dst) {
         return !0;
     }
-    let srcKeys = removePropsKeys(Object.keys(src), [ "children", "q:subs" ]);
-    let dstKeys = removePropsKeys(Object.keys(dst), [ "children", "q:subs" ]);
+    let srcKeys = removePropsKeys(Object.keys(src), [ "children", "q:brefs" ]);
+    let dstKeys = removePropsKeys(Object.keys(dst), [ "children", "q:brefs" ]);
     if (srcKeys.length !== dstKeys.length) {
         return !0;
     }
@@ -1847,22 +1946,21 @@ function cleanup(container, vNode) {
     for (;;) {
         const type = vCursor[VNodeProps.flags];
         if (type & VNodeFlags.ELEMENT_OR_VIRTUAL_MASK) {
-            if (clearVNodeEffectDependencies(container, vCursor), markVNodeAsDeleted(vCursor), 
-            type & VNodeFlags.Virtual) {
+            if (clearAllEffects(container, vCursor), markVNodeAsDeleted(vCursor), type & VNodeFlags.Virtual) {
                 const seq = container.getHostProp(vCursor, "q:seq");
                 if (seq) {
                     for (let i = 0; i < seq.length; i++) {
                         const obj = seq[i];
                         if (isTask(obj)) {
                             const task = obj;
-                            clearSubscriberEffectDependencies(container, task), task.$flags$ & TaskFlags.VISIBLE_TASK ? container.$scheduler$(ChoreType.CLEANUP_VISIBLE, task) : cleanupTask(task);
+                            clearAllEffects(container, task), task.$flags$ & TaskFlags.VISIBLE_TASK ? container.$scheduler$(ChoreType.CLEANUP_VISIBLE, task) : cleanupTask(task);
                         }
                     }
                 }
             }
             if (type & VNodeFlags.Virtual && null !== vnode_getProp(vCursor, "q:renderFn", null)) {
-                const attrs = vCursor;
-                for (let i = VirtualVNodeProps.PROPS_OFFSET; i < attrs.length; i += 2) {
+                const attrs = vnode_getProps(vCursor);
+                for (let i = 0; i < attrs.length; i += 2) {
                     const key = attrs[i];
                     if (!isParentSlotProp(key) && isSlotProp(key)) {
                         const value = attrs[i + 1];
@@ -1941,39 +2039,210 @@ var SiblingsArray;
     SiblingsArray[SiblingsArray.NextVNode = 5] = "NextVNode";
 }(SiblingsArray || (SiblingsArray = {}));
 
-const implicit$FirstArg = fn => function(first, ...rest) {
-    return fn.call(null, dollar(first), ...rest);
+const useResourceQrl = (qrl, opts) => {
+    const {val, set, i, iCtx} = useSequentialScope();
+    if (null != val) {
+        return val;
+    }
+    assertQrl(qrl);
+    const container = iCtx.$container$;
+    const resource = createResourceReturn(container, opts);
+    const task = new Task(TaskFlags.DIRTY | TaskFlags.RESOURCE, i, iCtx.$hostElement$, qrl, resource, null);
+    return container.$scheduler$(ChoreType.TASK, task), set(resource), resource;
 };
 
-const createSignal$1 = value => new Signal(null, value);
+const Resource = props => _jsxSorted(Fragment, null, null, getResourceValueAsPromise(props), 0, null);
 
-const createComputedSignal = qrl => (throwIfQRLNotResolved(qrl), new ComputedSignal(null, qrl));
+function getResourceValueAsPromise(props) {
+    const resource = props.value;
+    if (isResourceReturn(resource) && resource.value) {
+        if (!isServerPlatform()) {
+            const state = resource._state;
+            if ("pending" === state && props.onPending) {
+                return Promise.resolve().then(useBindInvokeContext(props.onPending));
+            }
+            if ("rejected" === state && props.onRejected) {
+                return Promise.resolve(resource._error).then(useBindInvokeContext(props.onRejected));
+            }
+            {
+                const resolvedValue = untrack((() => resource._resolved));
+                if (void 0 !== resolvedValue) {
+                    return Promise.resolve(resolvedValue).then(useBindInvokeContext(props.onResolved));
+                }
+            }
+        }
+        return resource.value.then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
+    }
+    return isPromise(resource) ? resource.then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected)) : isSignal(resource) ? Promise.resolve(resource.value).then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected)) : Promise.resolve(resource).then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
+}
 
-const createSignal = createSignal$1;
+const _createResourceReturn = opts => ({
+    __brand: "resource",
+    value: void 0,
+    loading: !isServerPlatform(),
+    _resolved: void 0,
+    _error: void 0,
+    _state: "pending",
+    _timeout: opts?.timeout ?? -1,
+    _cache: 0
+});
 
-const createComputedQrl = createComputedSignal;
+const createResourceReturn = (container, opts, initialPromise) => {
+    const result = _createResourceReturn(opts);
+    return result.value = initialPromise, createStore(container, result, StoreFlags.RECURSIVE);
+};
 
-const createComputed$ = /*#__PURE__*/ implicit$FirstArg(createComputedQrl);
+const isResourceReturn = obj => isObject(obj) && "resource" === (getStoreTarget(obj) || obj).__brand;
 
-var ChoreType;
+const runResource = (task, container, host) => {
+    task.$flags$ &= ~TaskFlags.DIRTY, cleanupTask(task);
+    const iCtx = newInvokeContext(container.$locale$, host, void 0, "qResource");
+    iCtx.$container$ = container;
+    const taskFn = task.$qrl$.getFn(iCtx, (() => clearAllEffects(container, task)));
+    const resource = task.$state$;
+    assertDefined(resource, 'useResource: when running a resource, "task.resource" must be a defined.', task);
+    const cleanups = [];
+    task.$destroy$ = noSerialize((() => {
+        cleanups.forEach((fn => {
+            try {
+                fn();
+            } catch (err) {
+                container.handleError(err, host);
+            }
+        })), done = !0;
+    }));
+    const resourceTarget = unwrapStore(resource);
+    const opts = {
+        track: (obj, prop) => {
+            const ctx = newInvokeContext();
+            return ctx.$effectSubscriber$ = getSubscriber(task, EffectProperty.COMPONENT), ctx.$container$ = container, 
+            invoke(ctx, (() => isFunction(obj) ? obj() : prop ? obj[prop] : isSignal(obj) ? obj.value : obj));
+        },
+        cleanup(fn) {
+            "function" == typeof fn && cleanups.push(fn);
+        },
+        cache(policy) {
+            let milliseconds = 0;
+            milliseconds = "immutable" === policy ? 1 / 0 : policy, resource._cache = milliseconds;
+        },
+        previous: resourceTarget._resolved
+    };
+    let resolve;
+    let reject;
+    let done = !1;
+    const setState = (resolved, value) => !done && (done = !0, resolved ? (done = !0, 
+    resource.loading = !1, resource._state = "resolved", resource._resolved = value, 
+    resource._error = void 0, resolve(value)) : (done = !0, resource.loading = !1, resource._state = "rejected", 
+    resource._error = value, reject(value)), !0);
+    cleanups.push((() => {
+        if (!0 === untrack((() => resource.loading))) {
+            const value = untrack((() => resource._resolved));
+            setState(!0, value);
+        }
+    })), invoke(iCtx, (() => {
+        resource._state = "pending", resource.loading = !isServerPlatform();
+        (resource.value = new Promise(((r, re) => {
+            resolve = r, reject = re;
+        }))).catch(ignoreErrorToPreventNodeFromCrashing);
+    }));
+    const promise = safeCall((() => Promise.resolve(taskFn(opts))), (value => {
+        setState(!0, value);
+    }), (err => {
+        if (isPromise(err)) {
+            return err.then((() => runResource(task, container, host)));
+        }
+        setState(!1, err);
+    }));
+    const timeout = resourceTarget._timeout;
+    return timeout > 0 ? Promise.race([ promise, delay(timeout).then((() => {
+        setState(!1, new Error("timeout")) && cleanupTask(task);
+    })) ]) : promise;
+};
 
-!function(ChoreType) {
-    ChoreType[ChoreType.MACRO = 240] = "MACRO", ChoreType[ChoreType.MICRO = 15] = "MICRO", 
-    ChoreType[ChoreType.QRL_RESOLVE = 1] = "QRL_RESOLVE", ChoreType[ChoreType.RESOURCE = 2] = "RESOURCE", 
-    ChoreType[ChoreType.TASK = 3] = "TASK", ChoreType[ChoreType.NODE_DIFF = 4] = "NODE_DIFF", 
-    ChoreType[ChoreType.NODE_PROP = 5] = "NODE_PROP", ChoreType[ChoreType.COMPONENT_SSR = 6] = "COMPONENT_SSR", 
-    ChoreType[ChoreType.COMPONENT = 7] = "COMPONENT", ChoreType[ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS = 8] = "RECOMPUTE_AND_SCHEDULE_EFFECTS", 
-    ChoreType[ChoreType.JOURNAL_FLUSH = 16] = "JOURNAL_FLUSH", ChoreType[ChoreType.VISIBLE = 32] = "VISIBLE", 
-    ChoreType[ChoreType.CLEANUP_VISIBLE = 48] = "CLEANUP_VISIBLE", ChoreType[ChoreType.WAIT_FOR_ALL = 255] = "WAIT_FOR_ALL";
-}(ChoreType || (ChoreType = {}));
+const ignoreErrorToPreventNodeFromCrashing = () => {};
+
+const aVNodePath = [];
+
+const bVNodePath = [];
+
+const vnode_documentPosition = (a, b, rootVNode) => {
+    if (a === b) {
+        return 0;
+    }
+    let aDepth = -1;
+    let bDepth = -1;
+    for (;a; ) {
+        a = (aVNodePath[++aDepth] = a)[VNodeProps.parent] || rootVNode && vnode_getProp(a, ":", (id => vnode_locate(rootVNode, id)));
+    }
+    for (;b; ) {
+        b = (bVNodePath[++bDepth] = b)[VNodeProps.parent] || rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id)));
+    }
+    for (;aDepth >= 0 && bDepth >= 0; ) {
+        if ((a = aVNodePath[aDepth]) !== (b = bVNodePath[bDepth])) {
+            let cursor = b;
+            do {
+                if (cursor = vnode_getNextSibling(cursor), cursor === a) {
+                    return 1;
+                }
+            } while (cursor);
+            cursor = b;
+            do {
+                if (cursor = vnode_getPreviousSibling(cursor), cursor === a) {
+                    return -1;
+                }
+            } while (cursor);
+            return rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id))) ? -1 : 1;
+        }
+        aDepth--, bDepth--;
+    }
+    return aDepth < bDepth ? -1 : 1;
+};
+
+const aSsrNodePath = [];
+
+const bSsrNodePath = [];
+
+const ssrNodeDocumentPosition = (a, b) => {
+    if (a === b) {
+        return 0;
+    }
+    let aDepth = -1;
+    let bDepth = -1;
+    for (;a; ) {
+        a = (aSsrNodePath[++aDepth] = a).currentComponentNode;
+    }
+    for (;b; ) {
+        b = (bSsrNodePath[++bDepth] = b).currentComponentNode;
+    }
+    for (;aDepth >= 0 && bDepth >= 0; ) {
+        if ((a = aSsrNodePath[aDepth]) !== (b = bSsrNodePath[bDepth])) {
+            return 1;
+        }
+        aDepth--, bDepth--;
+    }
+    return aDepth < bDepth ? -1 : 1;
+};
+
+const DEBUG$1 = !1;
+
+const getPromise = chore => chore.$promise$ ||= new Promise((resolve => {
+    chore.$resolve$ = resolve;
+}));
 
 const createScheduler = (container, scheduleDrain, journalFlush) => {
     const choreQueue = [];
+    const qrlRuns = [];
     let currentChore = null;
-    let journalFlushScheduled = !1;
+    let drainScheduled = !1;
     return function schedule(type, hostOrTask = null, targetOrQrl = null, payload = null) {
-        const runLater = type !== ChoreType.WAIT_FOR_ALL && type !== ChoreType.COMPONENT_SSR;
-        const isTask = type === ChoreType.TASK || type === ChoreType.VISIBLE || type === ChoreType.RESOURCE || type === ChoreType.CLEANUP_VISIBLE;
+        const isServer = !isDomContainer(container);
+        const isComponentSsr = isServer && type === ChoreType.COMPONENT;
+        const runLater = type !== ChoreType.WAIT_FOR_ALL && !isComponentSsr && type !== ChoreType.RUN_QRL;
+        const isTask = type === ChoreType.TASK || type === ChoreType.VISIBLE || type === ChoreType.CLEANUP_VISIBLE;
+        const isClientOnly = type === ChoreType.JOURNAL_FLUSH || type === ChoreType.NODE_DIFF || type === ChoreType.NODE_PROP;
+        if (isServer && isClientOnly) {
+            return;
+        }
         isTask && (hostOrTask.$flags$ |= TaskFlags.DIRTY);
         let chore = {
             $type$: type,
@@ -1986,303 +2255,241 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
             $returnValue$: null,
             $executed$: !1
         };
-        chore.$promise$ = new Promise((resolve => chore.$resolve$ = resolve)), chore = sortedInsert(choreQueue, chore, container.rootVNode || null), 
-        !journalFlushScheduled && runLater && (journalFlushScheduled = !0, schedule(ChoreType.JOURNAL_FLUSH), 
-        scheduleDrain());
-        return runLater ? chore.$promise$ : drainUpTo(chore, container.rootVNode || null);
+        chore = function(sortedArray, value, rootVNode) {
+            const idx = function(sortedArray, value, rootVNode) {
+                let bottom = 0;
+                let top = sortedArray.length;
+                for (;bottom < top; ) {
+                    const middle = bottom + (top - bottom >> 1);
+                    const comp = choreComparator(value, sortedArray[middle], rootVNode);
+                    if (comp < 0) {
+                        top = middle;
+                    } else {
+                        if (!(comp > 0)) {
+                            return middle;
+                        }
+                        bottom = middle + 1;
+                    }
+                }
+                return ~bottom;
+            }(sortedArray, value, rootVNode);
+            if (idx < 0) {
+                return sortedArray.splice(~idx, 0, value), value;
+            }
+            const existing = sortedArray[idx];
+            existing.$type$ === ChoreType.NODE_DIFF && (existing.$payload$ = value.$payload$);
+            existing.$executed$ && (existing.$executed$ = !1);
+            return existing;
+        }(choreQueue, chore, container.rootVNode || null), !drainScheduled && runLater && (drainScheduled = !0, 
+        schedule(ChoreType.JOURNAL_FLUSH), scheduleDrain()?.catch?.((() => {})));
+        return runLater ? getPromise(chore) : drainUpTo(chore, isServer);
     };
-    function drainUpTo(runUptoChore, rootVNode) {
-        if (runUptoChore.$executed$) {
-            return runUptoChore.$returnValue$;
-        }
-        if (currentChore) {
-            return runUptoChore.$promise$;
-        }
+    function drainUpTo(runUptoChore, isServer) {
+        let maxRetries = 5e3;
         for (;choreQueue.length; ) {
-            const nextChore = choreQueue.shift();
-            const order = choreComparator(nextChore, runUptoChore, rootVNode, !1);
-            if (null === order) {
-                continue;
+            if (maxRetries-- < 0) {
+                throw new Error("drainUpTo: max retries reached");
             }
-            if (order > 0) {
-                break;
-            }
-            if (vNodeAlreadyDeleted(nextChore) && nextChore.$type$ !== ChoreType.CLEANUP_VISIBLE) {
-                continue;
+            if (currentChore) {
+                return getPromise(currentChore).then((() => drainUpTo(runUptoChore, isServer))).catch((e => {
+                    container.handleError(e, currentChore?.$host$);
+                }));
             }
-            const returnValue = executeChore(nextChore);
-            if (isPromise(returnValue)) {
-                return returnValue.then((() => drainUpTo(runUptoChore, rootVNode)));
+            const nextChore = choreQueue[0];
+            if (nextChore.$executed$) {
+                if (choreQueue.shift(), nextChore === runUptoChore) {
+                    break;
+                }
+            } else {
+                vNodeAlreadyDeleted(nextChore) && nextChore.$type$ !== ChoreType.CLEANUP_VISIBLE ? choreQueue.shift() : executeChore(nextChore, isServer);
             }
         }
         return runUptoChore.$returnValue$;
     }
-    function executeChore(chore) {
+    function executeChore(chore, isServer) {
         const host = chore.$host$;
         assertEqual(currentChore, null, "Chore already running."), currentChore = chore;
         let returnValue = null;
-        switch (chore.$type$) {
-          case ChoreType.JOURNAL_FLUSH:
-            returnValue = journalFlush(), journalFlushScheduled = !1;
-            break;
-
-          case ChoreType.COMPONENT:
-          case ChoreType.COMPONENT_SSR:
-            returnValue = safeCall((() => executeComponent(container, host, host, chore.$target$, chore.$payload$)), (jsx => {
-                if (chore.$type$ === ChoreType.COMPONENT) {
-                    const styleScopedId = container.getHostProp(host, "q:sstyle");
-                    return vnode_diff(container, jsx, host, addComponentStylePrefix(styleScopedId));
-                }
-                return jsx;
-            }), (err => container.handleError(err, host)));
-            break;
-
-          case ChoreType.RESOURCE:
-            const result = runResource(chore.$payload$, container, host);
-            returnValue = isDomContainer(container) ? null : result;
-            break;
-
-          case ChoreType.TASK:
-          case ChoreType.VISIBLE:
-            returnValue = runTask(chore.$payload$, container, host);
-            break;
-
-          case ChoreType.CLEANUP_VISIBLE:
-            cleanupTask(chore.$payload$);
-            break;
-
-          case ChoreType.NODE_DIFF:
-            const parentVirtualNode = chore.$target$;
-            let jsx = chore.$payload$;
-            isSignal(jsx) && (jsx = jsx.value), returnValue = vnode_diff(container, jsx, parentVirtualNode, null);
-            break;
+        try {
+            switch (chore.$type$) {
+              case ChoreType.WAIT_FOR_ALL:
+                isServer && (drainScheduled = !1);
+                break;
 
-          case ChoreType.NODE_PROP:
-            const virtualNode = chore.$host$;
-            const payload = chore.$payload$;
-            let value = payload.$value$;
-            isSignal(value) && (value = value.value);
-            const isConst = payload.$isConst$;
-            const journal = container.$journal$;
-            const property = chore.$idx$;
-            const serializedValue = serializeAttribute(property, value, payload.$scopedStyleIdPrefix$);
-            if (isConst) {
-                journal.push(VNodeJournalOpCode.SetAttribute, virtualNode[ElementVNodeProps.element], property, serializedValue);
-            } else {
-                vnode_setAttr(journal, virtualNode, property, serializedValue);
-            }
-            break;
+              case ChoreType.JOURNAL_FLUSH:
+                returnValue = journalFlush(), drainScheduled = !1;
+                break;
 
-          case ChoreType.QRL_RESOLVE:
-            {
-                const target = chore.$target$;
-                returnValue = target.resolved ? null : target.resolve();
+              case ChoreType.COMPONENT:
+                returnValue = safeCall((() => executeComponent(container, host, host, chore.$target$, chore.$payload$)), (jsx => {
+                    if (isServer) {
+                        return jsx;
+                    }
+                    {
+                        const styleScopedId = container.getHostProp(host, "q:sstyle");
+                        return retryOnPromise((() => vnode_diff(container, jsx, host, addComponentStylePrefix(styleScopedId))));
+                    }
+                }), (err => container.handleError(err, host)));
                 break;
-            }
 
-          case ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS:
-            {
-                const target = chore.$target$;
-                const forceRunEffects = target.$forceRunEffects$;
-                if (target.$forceRunEffects$ = !1, !target.$effects$?.length) {
-                    break;
+              case ChoreType.RUN_QRL:
+                {
+                    const fn = chore.$target$.getFn();
+                    const result = retryOnPromise((() => fn(...chore.$payload$)));
+                    if (isPromise(result)) {
+                        const handled = result.finally((() => {
+                            qrlRuns.splice(qrlRuns.indexOf(handled), 1);
+                        })).catch((error => {
+                            container.handleError(error, chore.$host$);
+                        }));
+                        return qrlRuns.push(handled), chore.$returnValue$ = handled, chore.$resolve$?.(handled), 
+                        currentChore = null, void (chore.$executed$ = !0);
+                    }
+                    returnValue = null;
                 }
-                returnValue = retryOnPromise((() => {
-                    (target.$computeIfNeeded$() || forceRunEffects) && triggerEffects(container, target, target.$effects$);
-                }));
                 break;
-            }
-        }
-        return maybeThenPassError(returnValue, (value => (currentChore && (currentChore.$executed$ = !0, 
-        currentChore.$resolve$?.(value)), currentChore = null, chore.$returnValue$ = value)));
-    }
-};
-
-const toNumber = value => "number" == typeof value ? value : -1;
 
-const choreUpdate = (existing, newChore) => {
-    existing.$type$ === ChoreType.NODE_DIFF && (existing.$payload$ = newChore.$payload$);
-};
-
-function vNodeAlreadyDeleted(chore) {
-    return !!(chore.$host$ && vnode_isVNode(chore.$host$) && chore.$host$[VNodeProps.flags] & VNodeFlags.Deleted);
-}
-
-function choreComparator(a, b, rootVNode, shouldThrowOnHostMismatch) {
-    const macroTypeDiff = (a.$type$ & ChoreType.MACRO) - (b.$type$ & ChoreType.MACRO);
-    if (0 !== macroTypeDiff) {
-        return macroTypeDiff;
-    }
-    if (a.$type$ !== ChoreType.JOURNAL_FLUSH) {
-        const aHost = a.$host$;
-        const bHost = b.$host$;
-        if (aHost !== bHost && null !== aHost && null !== bHost) {
-            if (!vnode_isVNode(aHost) || !vnode_isVNode(bHost)) {
-                const errorMessage = `SERVER: during HTML streaming, re-running tasks on a different host is not allowed.\n          You are attempting to change a state that has already been streamed to the client.\n          This can lead to inconsistencies between Server-Side Rendering (SSR) and Client-Side Rendering (CSR).\n          Problematic Node: ${aHost.toString()}`;
-                if (shouldThrowOnHostMismatch) {
-                    throw qError(QError.serverHostMismatch, [ errorMessage ]);
-                }
-                return logWarn(errorMessage), null;
-            }
-            {
-                const hostDiff = vnode_documentPosition(aHost, bHost, rootVNode);
-                if (0 !== hostDiff) {
-                    return hostDiff;
+              case ChoreType.TASK:
+              case ChoreType.VISIBLE:
+                {
+                    const payload = chore.$payload$;
+                    if (payload.$flags$ & TaskFlags.RESOURCE) {
+                        const result = runResource(payload, container, host);
+                        returnValue = isServer ? result : null;
+                    } else {
+                        returnValue = runTask(payload, container, host);
+                    }
                 }
-            }
-        }
-        const microTypeDiff = (a.$type$ & ChoreType.MICRO) - (b.$type$ & ChoreType.MICRO);
-        if (0 !== microTypeDiff) {
-            return microTypeDiff;
-        }
-        const idxDiff = toNumber(a.$idx$) - toNumber(b.$idx$);
-        if (0 !== idxDiff) {
-            return idxDiff;
-        }
-        if (a.$target$ !== b.$target$ && (a.$type$ === ChoreType.QRL_RESOLVE && b.$type$ === ChoreType.QRL_RESOLVE || a.$type$ === ChoreType.NODE_PROP && b.$type$ === ChoreType.NODE_PROP || a.$type$ === ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS && b.$type$ === ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS)) {
-            return 1;
-        }
-    }
-    return 0;
-}
-
-function sortedFindIndex(sortedArray, value, rootVNode) {
-    let bottom = 0;
-    let top = sortedArray.length;
-    for (;bottom < top; ) {
-        const middle = bottom + (top - bottom >> 1);
-        const comp = choreComparator(value, sortedArray[middle], rootVNode, !0);
-        if (comp < 0) {
-            top = middle;
-        } else {
-            if (!(comp > 0)) {
-                return middle;
-            }
-            bottom = middle + 1;
-        }
-    }
-    return ~bottom;
-}
-
-function sortedInsert(sortedArray, value, rootVNode) {
-    const idx = sortedFindIndex(sortedArray, value, rootVNode);
-    if (idx < 0) {
-        return sortedArray.splice(~idx, 0, value), value;
-    }
-    const existing = sortedArray[idx];
-    return choreUpdate(existing, value), existing;
-}
-
-const useLexicalScope = () => {
-    const context = getInvokeContext();
-    let qrl = context.$qrl$;
-    if (qrl) {
-        assertQrl(qrl), assertDefined(qrl.$captureRef$, "invoke: qrl $captureRef$ must be defined inside useLexicalScope()", qrl);
-    } else {
-        const el = context.$element$;
-        assertDefined(el, "invoke: element must be defined inside useLexicalScope()", context);
-        const containerElement = _getQContainerElement(el);
-        assertDefined(containerElement, "invoke: cant find parent q:container of", el);
-        qrl = getDomContainer(containerElement).parseQRL(decodeURIComponent(String(context.$url$)));
-    }
-    return qrl.$captureRef$;
-};
-
-var TaskFlags;
+                break;
 
-!function(TaskFlags) {
-    TaskFlags[TaskFlags.VISIBLE_TASK = 1] = "VISIBLE_TASK", TaskFlags[TaskFlags.TASK = 2] = "TASK", 
-    TaskFlags[TaskFlags.RESOURCE = 4] = "RESOURCE", TaskFlags[TaskFlags.DIRTY = 8] = "DIRTY";
-}(TaskFlags || (TaskFlags = {}));
+              case ChoreType.CLEANUP_VISIBLE:
+                cleanupTask(chore.$payload$);
+                break;
 
-const useTaskQrl = (qrl, opts) => {
-    const {val, set, iCtx, i} = useSequentialScope();
-    if (val) {
-        return;
-    }
-    assertQrl(qrl), set(1);
-    const host = iCtx.$hostElement$;
-    const task = new Task(TaskFlags.DIRTY | TaskFlags.TASK, i, iCtx.$hostElement$, qrl, void 0, null);
-    set(task);
-    const result = runTask(task, iCtx.$container$, host);
-    if (isPromise(result)) {
-        throw result;
-    }
-    qrl.$resolveLazy$(iCtx.$element$), isServerPlatform() && useRunTask(task, opts?.eagerness);
-};
+              case ChoreType.NODE_DIFF:
+                {
+                    const parentVirtualNode = chore.$target$;
+                    let jsx = chore.$payload$;
+                    isSignal(jsx) && (jsx = jsx.value), returnValue = retryOnPromise((() => vnode_diff(container, jsx, parentVirtualNode, null)));
+                }
+                break;
 
-const runTask = (task, container, host) => {
-    task.$flags$ &= ~TaskFlags.DIRTY, cleanupTask(task);
-    const iCtx = newInvokeContext(container.$locale$, host, void 0, "qTask");
-    iCtx.$container$ = container;
-    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(container, task)));
-    const handleError = reason => container.handleError(reason, host);
-    let cleanupFns = null;
-    const cleanup = fn => {
-        "function" == typeof fn && (cleanupFns || (cleanupFns = [], task.$destroy$ = noSerialize((() => {
-            task.$destroy$ = null, cleanupFns.forEach((fn => {
-                try {
-                    fn();
-                } catch (err) {
-                    handleError(err);
+              case ChoreType.NODE_PROP:
+                {
+                    const virtualNode = chore.$host$;
+                    const payload = chore.$payload$;
+                    let value = payload.$value$;
+                    isSignal(value) && (value = value.value);
+                    const isConst = payload.$isConst$;
+                    const journal = container.$journal$;
+                    const property = chore.$idx$;
+                    const serializedValue = serializeAttribute(property, value, payload.$scopedStyleIdPrefix$);
+                    if (isConst) {
+                        journal.push(VNodeJournalOpCode.SetAttribute, virtualNode[ElementVNodeProps.element], property, serializedValue);
+                    } else {
+                        vnode_setAttr(journal, virtualNode, property, serializedValue);
+                    }
                 }
-            }));
-        }))), cleanupFns.push(fn));
-    };
-    const taskApi = {
-        track: (obj, prop) => {
-            const ctx = newInvokeContext();
-            return ctx.$effectSubscriber$ = [ task, EffectProperty.COMPONENT ], ctx.$container$ = container, 
-            invoke(ctx, (() => isFunction(obj) ? obj() : prop ? obj[prop] : isSignal(obj) ? obj.value : obj));
-        },
-        cleanup
-    };
-    return safeCall((() => taskFn(taskApi)), cleanup, (err => isPromise(err) ? err.then((() => runTask(task, container, host))) : handleError(err)));
-};
+                break;
 
-const cleanupTask = task => {
-    const destroy = task.$destroy$;
-    if (destroy) {
-        task.$destroy$ = null;
-        try {
-            destroy();
-        } catch (err) {
-            logError(err);
+              case ChoreType.QRL_RESOLVE:
+                {
+                    const target = chore.$target$;
+                    returnValue = target.resolved ? null : target.resolve();
+                }
+                break;
+
+              case ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS:
+                {
+                    const target = chore.$target$;
+                    const forceRunEffects = target.$forceRunEffects$;
+                    if (target.$forceRunEffects$ = !1, !target.$effects$?.size) {
+                        break;
+                    }
+                    returnValue = retryOnPromise((() => {
+                        (target.$computeIfNeeded$() || forceRunEffects) && triggerEffects(container, target, target.$effects$);
+                    }));
+                }
+            }
+        } catch (e) {
+            returnValue = Promise.reject(e);
         }
+        const after = (value, error) => {
+            currentChore = null, chore.$executed$ = !0, error ? container.handleError(error, host) : (chore.$returnValue$ = value, 
+            chore.$resolve$?.(value));
+        };
+        isPromise(returnValue) ? (chore.$promise$ = returnValue.then(after, (error => after(void 0, error))), 
+        chore.$resolve$?.(chore.$promise$), chore.$resolve$ = void 0) : after(returnValue);
+    }
+    function choreComparator(a, b, rootVNode) {
+        const macroTypeDiff = (a.$type$ & ChoreType.MACRO) - (b.$type$ & ChoreType.MACRO);
+        if (0 !== macroTypeDiff) {
+            return macroTypeDiff;
+        }
+        const aHost = a.$host$;
+        const bHost = b.$host$;
+        if (aHost !== bHost && null !== aHost && null !== bHost) {
+            if (vnode_isVNode(aHost) && vnode_isVNode(bHost)) {
+                const hostDiff = vnode_documentPosition(aHost, bHost, rootVNode);
+                if (0 !== hostDiff) {
+                    return hostDiff;
+                }
+            } else {
+                assertFalse(vnode_isVNode(aHost), "expected aHost to be SSRNode but it is a VNode"), 
+                assertFalse(vnode_isVNode(bHost), "expected bHost to be SSRNode but it is a VNode");
+                const errorMessage = `SERVER: during HTML streaming, re-running tasks on a different host is not allowed.\n          You are attempting to change a state that has already been streamed to the client.\n          This can lead to inconsistencies between Server-Side Rendering (SSR) and Client-Side Rendering (CSR).\n          Problematic Node: ${aHost.toString()}`;
+                logWarn(errorMessage);
+                const hostDiff = ssrNodeDocumentPosition(aHost, bHost);
+                if (0 !== hostDiff) {
+                    return hostDiff;
+                }
+            }
+        }
+        const microTypeDiff = (a.$type$ & ChoreType.MICRO) - (b.$type$ & ChoreType.MICRO);
+        if (0 !== microTypeDiff) {
+            return microTypeDiff;
+        }
+        const idxDiff = toNumber(a.$idx$) - toNumber(b.$idx$);
+        return 0 !== idxDiff ? idxDiff : a.$target$ !== b.$target$ || a.$payload$ !== b.$payload$ || b === currentChore ? 1 : 0;
     }
 };
 
-const useRunTask = (task, eagerness) => {
-    "visible" === eagerness || "intersection-observer" === eagerness ? useOn("qvisible", getTaskHandlerQrl(task)) : "load" === eagerness || "document-ready" === eagerness ? useOnDocument("qinit", getTaskHandlerQrl(task)) : "idle" !== eagerness && "document-idle" !== eagerness || useOnDocument("qidle", getTaskHandlerQrl(task));
-};
-
-const getTaskHandlerQrl = task => {
-    const taskQrl = task.$qrl$;
-    const taskHandler = createQRL(taskQrl.$chunk$, "_hW", _hW, null, null, [ task ], taskQrl.$symbol$);
-    return taskQrl.dev && (taskHandler.dev = taskQrl.dev), taskHandler;
-};
+const toNumber = value => "number" == typeof value ? value : -1;
 
-class Task extends Subscriber {
-    $flags$;
-    $index$;
-    $el$;
-    $qrl$;
-    $state$;
-    $destroy$;
-    constructor($flags$, $index$, $el$, $qrl$, $state$, $destroy$) {
-        super(), this.$flags$ = $flags$, this.$index$ = $index$, this.$el$ = $el$, this.$qrl$ = $qrl$, 
-        this.$state$ = $state$, this.$destroy$ = $destroy$;
-    }
+function vNodeAlreadyDeleted(chore) {
+    return !!(chore.$host$ && vnode_isVNode(chore.$host$) && chore.$host$[VNodeProps.flags] & VNodeFlags.Deleted);
 }
 
-const isTask = value => value instanceof Task;
+function debugChoreTypeToString(type) {
+    return {
+        [ChoreType.QRL_RESOLVE]: "QRL_RESOLVE",
+        [ChoreType.RUN_QRL]: "RUN_QRL",
+        [ChoreType.TASK]: "TASK",
+        [ChoreType.NODE_DIFF]: "NODE_DIFF",
+        [ChoreType.NODE_PROP]: "NODE_PROP",
+        [ChoreType.COMPONENT]: "COMPONENT",
+        [ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS]: "RECOMPUTE_SIGNAL",
+        [ChoreType.JOURNAL_FLUSH]: "JOURNAL_FLUSH",
+        [ChoreType.VISIBLE]: "VISIBLE",
+        [ChoreType.CLEANUP_VISIBLE]: "CLEANUP_VISIBLE",
+        [ChoreType.WAIT_FOR_ALL]: "WAIT_FOR_ALL"
+    }[type] || "UNKNOWN: " + type;
+}
 
-const _hW = () => {
-    const [task] = useLexicalScope();
-    getDomContainer(task.$el$).$scheduler$(task.$flags$ & TaskFlags.VISIBLE_TASK ? ChoreType.VISIBLE : ChoreType.TASK, task);
-};
+function debugChoreToString(chore) {
+    const type = debugChoreTypeToString(chore.$type$);
+    const host = String(chore.$host$).replaceAll(/\n.*/gim, "");
+    const qrlTarget = chore.$target$?.$symbol$;
+    return `Chore(${type} ${chore.$type$ === ChoreType.QRL_RESOLVE || chore.$type$ === ChoreType.RUN_QRL ? qrlTarget : host} ${chore.$idx$})`;
+}
 
-const NEEDS_COMPUTATION = Symbol("invalid");
+function debugTrace(action, arg, currentChore, queue) {
+    const lines = [ "===========================\nScheduler: " + action ];
+    arg && !("$type$" in arg) && lines.push("      arg: " + String(arg).replaceAll(/\n.*/gim, "")), 
+    queue && queue.forEach((chore => {
+        lines.push(`     ${chore === arg ? ">>>" : "   "} > ` + (chore === currentChore ? "[running] " : "") + debugChoreToString(chore));
+    })), console.log(lines.join("\n") + "\n");
+}
 
 const DEBUG = !1;
 
@@ -2296,21 +2503,21 @@ const throwIfQRLNotResolved = qrl => {
 
 const isSignal = value => value instanceof Signal;
 
-class EffectPropData {
+class SubscriptionData {
     data;
     constructor(data) {
         this.data = data;
     }
 }
 
-var EffectSubscriptionsProp;
+var EffectSubscriptionProp;
 
 var EffectProperty;
 
-!function(EffectSubscriptionsProp) {
-    EffectSubscriptionsProp[EffectSubscriptionsProp.EFFECT = 0] = "EFFECT", EffectSubscriptionsProp[EffectSubscriptionsProp.PROPERTY = 1] = "PROPERTY", 
-    EffectSubscriptionsProp[EffectSubscriptionsProp.FIRST_BACK_REF_OR_DATA = 2] = "FIRST_BACK_REF_OR_DATA";
-}(EffectSubscriptionsProp || (EffectSubscriptionsProp = {})), function(EffectProperty) {
+!function(EffectSubscriptionProp) {
+    EffectSubscriptionProp[EffectSubscriptionProp.CONSUMER = 0] = "CONSUMER", EffectSubscriptionProp[EffectSubscriptionProp.PROPERTY = 1] = "PROPERTY", 
+    EffectSubscriptionProp[EffectSubscriptionProp.BACK_REF = 2] = "BACK_REF", EffectSubscriptionProp[EffectSubscriptionProp.DATA = 3] = "DATA";
+}(EffectSubscriptionProp || (EffectSubscriptionProp = {})), function(EffectProperty) {
     EffectProperty.COMPONENT = ":", EffectProperty.VNODE = ".";
 }(EffectProperty || (EffectProperty = {}));
 
@@ -2340,9 +2547,9 @@ class Signal {
             }
             const effectSubscriber = ctx.$effectSubscriber$;
             if (effectSubscriber) {
-                const effects = this.$effects$ ||= [];
-                ensureContainsEffect(effects, effectSubscriber), ensureContains(effectSubscriber, this), 
-                isSubscriber(this) && ensureEffectContainsSubscriber(effectSubscriber[EffectSubscriptionsProp.EFFECT], this, this.$container$);
+                const effects = this.$effects$ ||= new Set;
+                ensureContainsSubscription(effects, effectSubscriber), ensureContainsBackRef(effectSubscriber, this), 
+                addQrlToSerializationCtx(effectSubscriber, this.$container$);
             }
         }
         return this.untrackedValue;
@@ -2354,7 +2561,7 @@ class Signal {
         qDev;
     }
     toString() {
-        return `[${this.constructor.name}${this.$invalid$ ? " INVALID" : ""} ${String(this.$untrackedValue$)}]` + (this.$effects$?.map((e => "\n -> " + pad(qwikDebugToString(e[0]), "    "))).join("\n") || "");
+        return `[${this.constructor.name}${this.$invalid$ ? " INVALID" : ""} ${String(this.$untrackedValue$)}]` + (Array.from(this.$effects$ || []).map((e => "\n -> " + pad(qwikDebugToString(e[0]), "    "))).join("\n") || "");
     }
     toJSON() {
         return {
@@ -2363,85 +2570,61 @@ class Signal {
     }
 }
 
-const ensureContains = (array, value) => {
-    -1 === array.indexOf(value) && array.push(value);
-};
-
-const ensureContainsEffect = (array, effectSubscriptions) => {
-    for (let i = 0; i < array.length; i++) {
-        const existingEffect = array[i];
-        if (existingEffect[0] === effectSubscriptions[0] && existingEffect[1] === effectSubscriptions[1]) {
-            return;
-        }
-    }
-    array.push(effectSubscriptions);
+const ensureContainsSubscription = (array, effectSubscription) => {
+    array.add(effectSubscription);
 };
 
-const ensureEffectContainsSubscriber = (effect, subscriber, container) => {
-    if (isSubscriber(effect)) {
-        if (effect.$effectDependencies$ ||= [], subscriberExistInSubscribers(effect.$effectDependencies$, subscriber)) {
-            return;
-        }
-        effect.$effectDependencies$.push(subscriber);
-    } else if (vnode_isVNode(effect) && !vnode_isTextVNode(effect)) {
-        let subscribers = vnode_getProp(effect, "q:subs", container ? container.$getObjectById$ : null);
-        if (subscribers ||= [], subscriberExistInSubscribers(subscribers, subscriber)) {
-            return;
-        }
-        subscribers.push(subscriber), vnode_setProp(effect, "q:subs", subscribers);
-    } else if (isSSRNode(effect)) {
-        let subscribers = effect.getProp("q:subs");
-        if (subscribers ||= [], subscriberExistInSubscribers(subscribers, subscriber)) {
-            return;
-        }
-        subscribers.push(subscriber), effect.setProp("q:subs", subscribers);
-    }
+const ensureContainsBackRef = (array, value) => {
+    array[EffectSubscriptionProp.BACK_REF] ||= new Set, array[EffectSubscriptionProp.BACK_REF].add(value);
 };
 
-const isSSRNode = effect => "setProp" in effect && "getProp" in effect && "removeProp" in effect && "id" in effect;
-
-const subscriberExistInSubscribers = (subscribers, subscriber) => {
-    for (let i = 0; i < subscribers.length; i++) {
-        if (subscribers[i] === subscriber) {
-            return !0;
-        }
+const addQrlToSerializationCtx = (effectSubscriber, container) => {
+    if (container && !isDomContainer(container)) {
+        const effect = effectSubscriber[EffectSubscriptionProp.CONSUMER];
+        const property = effectSubscriber[EffectSubscriptionProp.PROPERTY];
+        let qrl = null;
+        isTask(effect) ? qrl = effect.$qrl$ : effect instanceof ComputedSignal ? qrl = effect.$computeQrl$ : property === EffectProperty.COMPONENT && (qrl = container.getHostProp(effect, "q:renderFn")), 
+        qrl && container.serializationCtx.$eventQrls$.add(qrl);
     }
-    return !1;
 };
 
 const triggerEffects = (container, signal, effects) => {
+    const isBrowser = isDomContainer(container);
     if (effects) {
-        const scheduleEffect = effectSubscriptions => {
-            const effect = effectSubscriptions[EffectSubscriptionsProp.EFFECT];
-            const property = effectSubscriptions[EffectSubscriptionsProp.PROPERTY];
-            if (assertDefined(container, "Container must be defined."), isTask(effect)) {
-                effect.$flags$ |= TaskFlags.DIRTY;
+        const scheduleEffect = effectSubscription => {
+            const consumer = effectSubscription[EffectSubscriptionProp.CONSUMER];
+            const property = effectSubscription[EffectSubscriptionProp.PROPERTY];
+            if (assertDefined(container, "Container must be defined."), isTask(consumer)) {
+                consumer.$flags$ |= TaskFlags.DIRTY;
                 let choreType = ChoreType.TASK;
-                effect.$flags$ & TaskFlags.VISIBLE_TASK ? choreType = ChoreType.VISIBLE : effect.$flags$ & TaskFlags.RESOURCE && (choreType = ChoreType.RESOURCE), 
-                container.$scheduler$(choreType, effect);
-            } else if (effect instanceof Signal) {
-                effect instanceof ComputedSignal && (effect.$computeQrl$.resolved || container.$scheduler$(ChoreType.QRL_RESOLVE, null, effect.$computeQrl$)), 
-                effect.$invalidate$();
+                consumer.$flags$ & TaskFlags.VISIBLE_TASK && (choreType = ChoreType.VISIBLE), container.$scheduler$(choreType, consumer);
+            } else if (consumer instanceof Signal) {
+                consumer instanceof ComputedSignal && (consumer.$computeQrl$.resolved || container.$scheduler$(ChoreType.QRL_RESOLVE, null, consumer.$computeQrl$)), 
+                consumer.$invalidate$();
             } else if (property === EffectProperty.COMPONENT) {
-                const host = effect;
+                const host = consumer;
                 const qrl = container.getHostProp(host, "q:renderFn");
                 assertDefined(qrl, "Component must have QRL");
                 const props = container.getHostProp(host, "q:props");
                 container.$scheduler$(ChoreType.COMPONENT, host, qrl, props);
-            } else if (property === EffectProperty.VNODE) {
-                container.$scheduler$(ChoreType.NODE_DIFF, effect, effect, signal);
-            } else {
-                const effectData = effectSubscriptions[EffectSubscriptionsProp.FIRST_BACK_REF_OR_DATA];
-                if (effectData instanceof EffectPropData) {
-                    const payload = {
-                        ...effectData.data,
-                        $value$: signal
-                    };
-                    container.$scheduler$(ChoreType.NODE_PROP, effect, property, payload);
+            } else if (isBrowser) {
+                if (property === EffectProperty.VNODE) {
+                    container.$scheduler$(ChoreType.NODE_DIFF, consumer, consumer, signal);
+                } else {
+                    const effectData = effectSubscription[EffectSubscriptionProp.DATA];
+                    if (effectData instanceof SubscriptionData) {
+                        const payload = {
+                            ...effectData.data,
+                            $value$: signal
+                        };
+                        container.$scheduler$(ChoreType.NODE_PROP, consumer, property, payload);
+                    }
                 }
             }
         };
-        effects.forEach(scheduleEffect);
+        for (const effect of effects) {
+            scheduleEffect(effect);
+        }
     }
 };
 
@@ -2471,7 +2654,7 @@ class ComputedSignal extends Signal {
         throwIfQRLNotResolved(computeQrl);
         const ctx = tryGetInvokeContext();
         const previousEffectSubscription = ctx?.$effectSubscriber$;
-        ctx && (ctx.$effectSubscriber$ = [ this, EffectProperty.VNODE ]);
+        ctx && (ctx.$effectSubscriber$ = getSubscriber(this, EffectProperty.VNODE));
         try {
             const untrackedValue = computeQrl.getFn(ctx)();
             if (isPromise(untrackedValue)) {
@@ -2497,9 +2680,9 @@ class WrappedSignal extends Signal {
     $func$;
     $funcStr$;
     $invalid$=!0;
-    $effectDependencies$=null;
     $hostElement$=null;
     $forceRunEffects$=!1;
+    [_EFFECT_BACK_REF]=null;
     constructor(container, fn, args, fnStr) {
         super(container, NEEDS_COMPUTATION), this.$args$ = args, this.$func$ = fn, this.$funcStr$ = fnStr;
     }
@@ -2542,7 +2725,7 @@ const applyQwikComponentBody = (ssr, jsx, component) => {
     srcProps && srcProps.children && delete srcProps.children;
     const scheduler = ssr.$scheduler$;
     return host.setProp("q:renderFn", componentQrl), host.setProp("q:props", srcProps), 
-    null !== jsx.key && host.setProp("q:key", jsx.key), scheduler(ChoreType.COMPONENT_SSR, host, componentQrl, srcProps);
+    null !== jsx.key && host.setProp("q:key", jsx.key), scheduler(ChoreType.COMPONENT, host, componentQrl, srcProps);
 };
 
 class ParentComponentData {
@@ -2553,18 +2736,10 @@ class ParentComponentData {
     }
 }
 
-function _walkJSX(ssr, value, options) {
+async function _walkJSX(ssr, value, options) {
     const stack = [ value ];
-    let resolveDrain;
-    let rejectDrain;
-    const drained = options.allowPromises && new Promise(((res, rej) => {
-        resolveDrain = res, rejectDrain = rej;
-    }));
     const enqueue = value => stack.push(value);
-    const resolveValue = value => {
-        stack.push(value), drain();
-    };
-    const drain = () => {
+    await (async () => {
         for (;stack.length; ) {
             const value = stack.pop();
             if (value instanceof ParentComponentData) {
@@ -2576,23 +2751,13 @@ function _walkJSX(ssr, value, options) {
                 });
             } else {
                 if (value === Promise) {
-                    if (!options.allowPromises) {
-                        throw qError(QError.promisesNotExpected);
-                    }
-                    return void stack.pop().then(resolveValue, rejectDrain);
-                }
-                const waitOn = value.apply(ssr);
-                if (waitOn) {
-                    if (!options.allowPromises) {
-                        throw qError(QError.promisesNotExpected);
-                    }
-                    return void waitOn.then(drain, rejectDrain);
+                    stack.push(await stack.pop());
+                    continue;
                 }
+                await value.apply(ssr);
             }
         }
-        0 === stack.length && options.allowPromises && resolveDrain();
-    };
-    return drain(), drained;
+    })();
 }
 
 function processJSXNode(ssr, enqueue, value, options) {
@@ -2620,7 +2785,6 @@ function processJSXNode(ssr, enqueue, value, options) {
             enqueue((async () => {
                 for await (const chunk of value) {
                     await _walkJSX(ssr, chunk, {
-                        allowPromises: !0,
                         currentStyleScoped: options.styleScoped,
                         parentComponentFrame: options.parentComponentFrame
                     }), ssr.commentNode("qkssr-f");
@@ -2671,7 +2835,6 @@ function processJSXNode(ssr, enqueue, value, options) {
                     value = isFunction(generator) ? generator({
                         async write(chunk) {
                             await _walkJSX(ssr, chunk, {
-                                allowPromises: !0,
                                 currentStyleScoped: options.styleScoped,
                                 parentComponentFrame: options.parentComponentFrame
                             }), ssr.commentNode("qkssr-f");
@@ -2759,18 +2922,20 @@ function setEvent(serializationCtx, key, rawValue) {
     const appendToValue = valueToAppend => {
         value = (null == value ? "" : value + "\n") + valueToAppend;
     };
+    const getQrlString = qrl => (qrl.$symbol$.startsWith("_") || !qrl.$captureRef$ && !qrl.$capture$ || (qrl = createQRL(null, "_run", queueQRL, null, null, [ qrl ])), 
+    qrlToString(serializationCtx, qrl));
     if (Array.isArray(qrls)) {
         for (let i = 0; i <= qrls.length; i++) {
             const qrl = qrls[i];
-            if (isQrl(qrl)) {
-                appendToValue(qrlToString(serializationCtx, qrl)), addQwikEventToSerializationContext(serializationCtx, key, qrl);
+            if (isQrl$1(qrl)) {
+                appendToValue(getQrlString(qrl)), addQwikEventToSerializationContext(serializationCtx, key, qrl);
             } else if (null != qrl) {
                 const nestedValue = setEvent(serializationCtx, key, qrl);
                 nestedValue && appendToValue(nestedValue);
             }
         }
     } else {
-        isQrl(qrls) && (value = qrlToString(serializationCtx, qrls), addQwikEventToSerializationContext(serializationCtx, key, qrls));
+        isQrl$1(qrls) && (value = getQrlString(qrls), addQwikEventToSerializationContext(serializationCtx, key, qrls));
     }
     return value;
 }
@@ -2805,7 +2970,7 @@ function appendClassIfScopedStyleExists(jsx, styleScoped) {
     jsx.constProps.class = "");
 }
 
-const version = "2.0.0-alpha.5-dev+cb53bbd";
+const version = "2.0.0-alpha.7-dev+a26598a";
 
 class _SharedContainer {
     $version$;
@@ -2830,12 +2995,6 @@ class _SharedContainer {
     }
 }
 
-const _CONST_PROPS = Symbol("CONST");
-
-const _VAR_PROPS = Symbol("VAR");
-
-const _IMMUTABLE = Symbol("IMMUTABLE");
-
 const getValueProp = p0 => p0.value;
 
 const getProp = (p0, p1) => p0[p1];
@@ -3052,7 +3211,7 @@ function qwikDebugToString(value) {
     if (isTask(value)) {
         return `Task(${qwikDebugToString(value.$qrl$)})`;
     }
-    if (isQrl$1(value)) {
+    if (isQrl(value)) {
         return `Qrl(${value.$symbol$})`;
     }
     if ("object" == typeof value || "function" == typeof value) {
@@ -3158,14 +3317,21 @@ const VNodeDataChar = {
     CONTEXT_CHAR: "]",
     SEQ_IDX: 94,
     SEQ_IDX_CHAR: "^",
-    SUBS: 96,
-    SUBS_CHAR: "`",
+    BACK_REFS: 96,
+    BACK_REFS_CHAR: "`",
     SEPARATOR: 124,
     SEPARATOR_CHAR: "|",
     SLOT: 126,
     SLOT_CHAR: "~"
 };
 
+const mergeMaps = (map1, map2) => {
+    for (const [k, v] of map2) {
+        map1.set(k, v);
+    }
+    return map1;
+};
+
 var VNodeJournalOpCode;
 
 !function(VNodeJournalOpCode) {
@@ -3271,6 +3437,7 @@ const vnode_ensureElementInflated = vnode => {
         elementVNode[VNodeProps.flags] ^= VNodeFlags.Inflated;
         const element = elementVNode[ElementVNodeProps.element];
         const attributes = element.attributes;
+        const props = vnode_getProps(elementVNode);
         for (let idx = 0; idx < attributes.length; idx++) {
             const attr = attributes[idx];
             const key = attr.name;
@@ -3278,9 +3445,9 @@ const vnode_ensureElementInflated = vnode => {
                 break;
             }
             if (key.startsWith("q:container")) {
-                attr.value === QContainerValue.HTML ? mapArray_set(elementVNode, dangerouslySetInnerHTML, element.innerHTML, ElementVNodeProps.PROPS_OFFSET) : attr.value === QContainerValue.TEXT && "value" in element && mapArray_set(elementVNode, "value", element.value, ElementVNodeProps.PROPS_OFFSET);
+                attr.value === QContainerValue.HTML ? mapArray_set(props, dangerouslySetInnerHTML, element.innerHTML, 0) : attr.value === QContainerValue.TEXT && "value" in element && mapArray_set(props, "value", element.value, 0);
             } else if (!key.startsWith("on:")) {
-                mapArray_set(elementVNode, key, attr.value, ElementVNodeProps.PROPS_OFFSET);
+                mapArray_set(props, key, attr.value, 0);
             }
         }
     }
@@ -3550,33 +3717,9 @@ const vnode_applyJournal = journal => {
     journal.length = 0;
 };
 
-const mapApp_findIndx = (elementVNode, key, start) => {
-    assertTrue(start % 2 == 0, "Expecting even number.");
-    let bottom = start >> 1;
-    let top = elementVNode.length - 2 >> 1;
-    for (;bottom <= top; ) {
-        const mid = bottom + (top - bottom >> 1);
-        const midKey = elementVNode[mid << 1];
-        if (midKey === key) {
-            return mid << 1;
-        }
-        midKey < key ? bottom = mid + 1 : top = mid - 1;
-    }
-    return ~(bottom << 1);
-};
-
-const mapArray_set = (elementVNode, key, value, start) => {
-    const indx = mapApp_findIndx(elementVNode, key, start);
-    indx >= 0 ? null == value ? elementVNode.splice(indx, 2) : elementVNode[indx + 1] = value : null != value && elementVNode.splice(~indx, 0, key, value);
-};
-
-const mapArray_get = (elementVNode, key, start) => {
-    const indx = mapApp_findIndx(elementVNode, key, start);
-    return indx >= 0 ? elementVNode[indx + 1] : null;
-};
-
 const vnode_insertBefore = (journal, parent, newChild, insertBefore) => {
-    ensureElementOrVirtualVNode(parent), vnode_isElementVNode(parent) && ensureMaterialized(parent);
+    ensureElementOrVirtualVNode(parent), vnode_isElementVNode(parent) && ensureMaterialized(parent), 
+    newChild === insertBefore && (insertBefore = null);
     let adjustedInsertBefore = null;
     null == insertBefore ? vnode_isVirtualVNode(parent) && (adjustedInsertBefore = vnode_getDomSibling(parent, !0, !1)) : adjustedInsertBefore = vnode_isVirtualVNode(insertBefore) ? vnode_getDomSibling(insertBefore, !0, !0) : insertBefore, 
     adjustedInsertBefore && vnode_ensureInflatedIfText(journal, adjustedInsertBefore);
@@ -3635,9 +3778,12 @@ const vnode_truncate = (journal, vParent, vDelete) => {
 const vnode_getElementName = vnode => {
     const elementVNode = ensureElementVNode(vnode);
     let elementName = elementVNode[ElementVNodeProps.elementName];
-    return void 0 === elementName && (elementName = elementVNode[ElementVNodeProps.elementName] = elementVNode[ElementVNodeProps.element].nodeName.toLowerCase(), 
-    elementVNode[VNodeProps.flags] |= vnode_getElementNamespaceFlags(elementName)), 
-    elementName;
+    if (void 0 === elementName) {
+        const element = elementVNode[ElementVNodeProps.element];
+        const nodeName = isDev ? fastNodeName(element).toLowerCase() : fastNodeName(element);
+        elementName = elementVNode[ElementVNodeProps.elementName] = nodeName, elementVNode[VNodeProps.flags] |= vnode_getElementNamespaceFlags(element);
+    }
+    return elementName;
 };
 
 const vnode_getText = vnode => {
@@ -3765,6 +3911,16 @@ const fastFirstChild = node => {
     return node;
 };
 
+let _fastNamespaceURI = null;
+
+const fastNamespaceURI = element => (_fastNamespaceURI || (_fastNamespaceURI = fastGetter(element, "namespaceURI")), 
+_fastNamespaceURI.call(element));
+
+let _fastNodeName = null;
+
+const fastNodeName = element => (_fastNodeName || (_fastNodeName = fastGetter(element, "nodeName")), 
+_fastNodeName.call(element));
+
 const fastGetter = (prototype, name) => {
     let getter;
     for (;prototype && !(getter = Object.getOwnPropertyDescriptor(prototype, name)?.get); ) {
@@ -3804,13 +3960,25 @@ const materializeFromDOM = (vParent, firstChild, vData) => {
                 const id = consumeValue();
                 container.$setRawState$(parseInt(id), vParent), isDev && vnode_setAttr(null, vParent, "q:id", id);
             } else {
-                peek() === VNodeDataChar.SUBS ? vnode_setProp(vParent, "q:subs", consumeValue()) : consumeValue();
+                peek() === VNodeDataChar.BACK_REFS ? (container || (container = getDomContainer(vParent[ElementVNodeProps.element])), 
+                setEffectBackRefFromVNodeData(vParent, consumeValue(), container)) : consumeValue();
             }
         }));
     }
     return vFirstChild;
 };
 
+function setEffectBackRefFromVNodeData(vParent, value, container) {
+    const deserializedSubMap = container.$getObjectById$(value);
+    if (vParent[_EFFECT_BACK_REF]) {
+        mergeMaps(vParent[_EFFECT_BACK_REF], deserializedSubMap);
+    } else {
+        Object.defineProperty(vParent, _EFFECT_BACK_REF, {
+            value: deserializedSubMap
+        });
+    }
+}
+
 const processVNodeData$1 = (vData, callback) => {
     let nextToConsumeIdx = 0;
     let ch = 0;
@@ -3838,8 +4006,9 @@ const vnode_getAttrKeys = vnode => {
     if (vnode[VNodeProps.flags] & VNodeFlags.ELEMENT_OR_VIRTUAL_MASK) {
         vnode_ensureElementInflated(vnode);
         const keys = [];
-        for (let i = vnode_getPropStartIndex(vnode); i < vnode.length; i += 2) {
-            const key = vnode[i];
+        const props = vnode_getProps(vnode);
+        for (let i = 0; i < props.length; i += 2) {
+            const key = props[i];
             key.startsWith(":") || keys.push(key);
         }
         return keys;
@@ -3851,29 +4020,37 @@ const vnode_setAttr = (journal, vnode, key, value) => {
     const type = vnode[VNodeProps.flags];
     if (type & VNodeFlags.ELEMENT_OR_VIRTUAL_MASK) {
         vnode_ensureElementInflated(vnode);
-        const idx = mapApp_findIndx(vnode, key, vnode_getPropStartIndex(vnode));
+        const props = vnode_getProps(vnode);
+        const idx = mapApp_findIndx(props, key, 0);
         if (idx >= 0) {
-            if (vnode[idx + 1] != value && type & VNodeFlags.Element) {
+            if (props[idx + 1] != value && type & VNodeFlags.Element) {
                 journal && journal.push(VNodeJournalOpCode.SetAttribute, vnode[ElementVNodeProps.element], key, value);
             }
-            null == value ? vnode.splice(idx, 2) : vnode[idx + 1] = value;
-        } else if (null != value && (vnode.splice(~idx, 0, key, value), type & VNodeFlags.Element)) {
+            null == value ? props.splice(idx, 2) : props[idx + 1] = value;
+        } else if (null != value && (props.splice(~idx, 0, key, value), type & VNodeFlags.Element)) {
             journal && journal.push(VNodeJournalOpCode.SetAttribute, vnode[ElementVNodeProps.element], key, value);
         }
     }
 };
 
-const vnode_getAttr = (vnode, key) => vnode[VNodeProps.flags] & VNodeFlags.ELEMENT_OR_VIRTUAL_MASK ? (vnode_ensureElementInflated(vnode), 
-mapArray_get(vnode, key, vnode_getPropStartIndex(vnode))) : null;
+const vnode_getAttr = (vnode, key) => {
+    if (vnode[VNodeProps.flags] & VNodeFlags.ELEMENT_OR_VIRTUAL_MASK) {
+        vnode_ensureElementInflated(vnode);
+        const props = vnode_getProps(vnode);
+        return mapArray_get(props, key, 0);
+    }
+    return null;
+};
 
 const vnode_getProp = (vnode, key, getObject) => {
     const type = vnode[VNodeProps.flags];
     if (type & VNodeFlags.ELEMENT_OR_VIRTUAL_MASK) {
         type & VNodeFlags.Element && vnode_ensureElementInflated(vnode);
-        const idx = mapApp_findIndx(vnode, key, vnode_getPropStartIndex(vnode));
+        const props = vnode_getProps(vnode);
+        const idx = mapApp_findIndx(props, key, 0);
         if (idx >= 0) {
-            let value = vnode[idx + 1];
-            return "string" == typeof value && getObject && (vnode[idx + 1] = value = getObject(value)), 
+            let value = props[idx + 1];
+            return "string" == typeof value && getObject && (props[idx + 1] = value = getObject(value)), 
             value;
         }
     }
@@ -3882,8 +4059,9 @@ const vnode_getProp = (vnode, key, getObject) => {
 
 const vnode_setProp = (vnode, key, value) => {
     ensureElementOrVirtualVNode(vnode);
-    const idx = mapApp_findIndx(vnode, key, vnode_getPropStartIndex(vnode));
-    idx >= 0 ? vnode[idx + 1] = value : null != value && vnode.splice(~idx, 0, key, value);
+    const props = vnode_getProps(vnode);
+    const idx = mapApp_findIndx(props, key, 0);
+    idx >= 0 ? props[idx + 1] = value : null != value && props.splice(~idx, 0, key, value);
 };
 
 const vnode_getPropStartIndex = vnode => {
@@ -3897,6 +4075,8 @@ const vnode_getPropStartIndex = vnode => {
     throw qError(QError.invalidVNodeType, [ type ]);
 };
 
+const vnode_getProps = vnode => vnode[vnode_getPropStartIndex(vnode)];
+
 const vnode_getParent = vnode => vnode[VNodeProps.parent] || null;
 
 const vnode_getNode = vnode => null === vnode || vnode_isVirtualVNode(vnode) ? null : vnode_isElementVNode(vnode) ? vnode[ElementVNodeProps.element] : (assertTrue(vnode_isTextVNode(vnode), "Expecting Text Node."), 
@@ -4017,8 +4197,8 @@ function materializeFromVNodeData(vParent, vData, element, child) {
             vnode_setAttr(null, vParent, "q:seq", consumeValue());
         } else if (peek() === VNodeDataChar.SEQ_IDX) {
             vnode_setAttr(null, vParent, "q:seqIdx", consumeValue());
-        } else if (peek() === VNodeDataChar.SUBS) {
-            vnode_setProp(vParent, "q:subs", consumeValue());
+        } else if (peek() === VNodeDataChar.BACK_REFS) {
+            container || (container = getDomContainer(element)), setEffectBackRefFromVNodeData(vParent, consumeValue(), container);
         } else if (peek() === VNodeDataChar.CONTEXT) {
             vnode_setAttr(null, vParent, "q:ctx", consumeValue());
         } else if (peek() === VNodeDataChar.OPEN) {
@@ -4064,43 +4244,6 @@ const vnode_getType = vnode => {
 
 const isElement = node => node && "object" == typeof node && 1 === fastNodeType(node);
 
-const aPath = [];
-
-const bPath = [];
-
-const vnode_documentPosition = (a, b, rootVNode) => {
-    if (a === b) {
-        return 0;
-    }
-    let aDepth = -1;
-    let bDepth = -1;
-    for (;a; ) {
-        a = (aPath[++aDepth] = a)[VNodeProps.parent] || rootVNode && vnode_getProp(a, ":", (id => vnode_locate(rootVNode, id)));
-    }
-    for (;b; ) {
-        b = (bPath[++bDepth] = b)[VNodeProps.parent] || rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id)));
-    }
-    for (;aDepth >= 0 && bDepth >= 0; ) {
-        if ((a = aPath[aDepth]) !== (b = bPath[bDepth])) {
-            let cursor = b;
-            do {
-                if (cursor = vnode_getNextSibling(cursor), cursor === a) {
-                    return 1;
-                }
-            } while (cursor);
-            cursor = b;
-            do {
-                if (cursor = vnode_getPreviousSibling(cursor), cursor === a) {
-                    return -1;
-                }
-            } while (cursor);
-            return rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id))) ? -1 : 1;
-        }
-        aDepth--, bDepth--;
-    }
-    return aDepth < bDepth ? -1 : 1;
-};
-
 const vnode_getProjectionParentComponent = (vHost, rootVNode) => {
     let projectionDepth = 1;
     for (;projectionDepth--; ) {
@@ -4116,19 +4259,16 @@ const vnode_getProjectionParentComponent = (vHost, rootVNode) => {
 
 const VNodeArray = class VNode extends Array {
     static createElement(flags, parent, previousSibling, nextSibling, firstChild, lastChild, element, elementName) {
-        const vnode = new VNode(flags, parent, previousSibling, nextSibling);
-        return vnode.push(firstChild, lastChild, element, elementName), vnode;
+        return new VNode(flags, parent, previousSibling, nextSibling, firstChild, lastChild, element, elementName, []);
     }
     static createText(flags, parent, previousSibling, nextSibling, textNode, text) {
-        const vnode = new VNode(flags, parent, previousSibling, nextSibling);
-        return vnode.push(textNode, text), vnode;
+        return new VNode(flags, parent, previousSibling, nextSibling, textNode, text);
     }
     static createVirtual(flags, parent, previousSibling, nextSibling, firstChild, lastChild) {
-        const vnode = new VNode(flags, parent, previousSibling, nextSibling);
-        return vnode.push(firstChild, lastChild), vnode;
+        return new VNode(flags, parent, previousSibling, nextSibling, firstChild, lastChild, []);
     }
-    constructor(flags, parent, previousSibling, nextSibling) {
-        super(), this.push(flags, parent, previousSibling, nextSibling), isDev && (this.toString = vnode_toString);
+    constructor(flags, parent, previousSibling, nextSibling, ...rest) {
+        super(flags, parent, previousSibling, nextSibling, ...rest), isDev && (this.toString = vnode_toString);
     }
 };
 
@@ -4189,9 +4329,11 @@ function invokeApply(context, fn, args) {
 }
 
 const newInvokeContextFromTuple = ([element, event, url]) => {
-    const container = element.closest(QContainerSelector);
+    const domContainer = getDomContainer(element);
+    const container = domContainer.element;
+    const vNode = container ? vnode_locate(domContainer.rootVNode, element) : void 0;
     const locale = container?.getAttribute("q:locale") || void 0;
-    return locale && setLocale(locale), newInvokeContext(locale, void 0, element, event, url);
+    return locale && setLocale(locale), newInvokeContext(locale, vNode, element, event, url);
 };
 
 const newInvokeContext = (locale, hostElement, element, event, url) => {
@@ -4217,7 +4359,7 @@ const trackSignal = (fn, subscriber, property, container, data) => {
     const previousSubscriber = trackInvocation.$effectSubscriber$;
     const previousContainer = trackInvocation.$container$;
     try {
-        return trackInvocation.$effectSubscriber$ = [ subscriber, property ], data && trackInvocation.$effectSubscriber$.push(data), 
+        return trackInvocation.$effectSubscriber$ = getSubscriber(subscriber, property, data), 
         trackInvocation.$container$ = container, invoke(trackInvocation, fn);
     } finally {
         trackInvocation.$effectSubscriber$ = previousSubscriber, trackInvocation.$container$ = previousContainer;
@@ -4232,7 +4374,7 @@ const _getContextElement = () => {
     if (iCtx) {
         const hostElement = iCtx.$hostElement$;
         let element = null;
-        return vnode_isVNode(hostElement) && vnode_isElementVNode(hostElement) && (element = vnode_getNode(hostElement)), 
+        return null != hostElement && (vnode_isVNode(hostElement) ? vnode_isElementVNode(hostElement) && (element = vnode_getNode(hostElement)) : element = hostElement), 
         element ?? iCtx.$qrl$?.$setContainer$(void 0);
     }
 };
@@ -4513,9 +4655,9 @@ class DomContainer extends _SharedContainer {
     $storeProxyMap$=new WeakMap;
     $qFuncs$;
     $instanceHash$;
-    stateData;
+    vNodeLocate=id => vnode_locate(this.rootVNode, id);
+    $stateData$;
     $styleIds$=null;
-    $vnodeLocate$=id => vnode_locate(this.rootVNode, id);
     $renderCount$=0;
     constructor(element) {
         if (super((() => this.scheduleRender()), (() => vnode_applyJournal(this.$journal$)), {}, element.getAttribute("q:locale")), 
@@ -4525,24 +4667,24 @@ class DomContainer extends _SharedContainer {
         this.$journal$ = [ VNodeJournalOpCode.HoistStyles, element.ownerDocument ], this.document = element.ownerDocument, 
         this.element = element, this.qBase = element.getAttribute("q:base"), this.$instanceHash$ = element.getAttribute("q:instance"), 
         this.qManifestHash = element.getAttribute("q:manifest-hash"), this.rootVNode = vnode_newUnMaterializedElement(this.element), 
-        this.$rawStateData$ = null, this.stateData = null;
+        this.$rawStateData$ = null, this.$stateData$ = null;
         const document = this.element.ownerDocument;
-        document.qVNodeData || processVNodeData(document), this.$rawStateData$ = [], this.stateData = [];
+        document.qVNodeData || processVNodeData(document), this.$rawStateData$ = [], this.$stateData$ = [];
         const qwikStates = element.querySelectorAll('script[type="qwik/state"]');
         if (0 !== qwikStates.length) {
             this.$rawStateData$ = JSON.parse(qwikStates[qwikStates.length - 1].textContent), 
-            this.stateData = wrapDeserializerProxy(this, this.$rawStateData$);
+            this.$stateData$ = wrapDeserializerProxy(this, this.$rawStateData$);
         }
         this.$qFuncs$ = getQFuncs(document, this.$instanceHash$) || EMPTY_ARRAY;
     }
     $setRawState$(id, vParent) {
-        this.stateData[id] = vParent;
+        this.$stateData$[id] = vParent;
     }
     parseQRL(qrl) {
         return inflateQRL(this, parseQRL(qrl));
     }
     handleError(err, host) {
-        const errorStore = this.resolveContext(host, ERROR_CONTEXT);
+        const errorStore = host && this.resolveContext(host, ERROR_CONTEXT);
         if (!errorStore) {
             throw err;
         }
@@ -4571,7 +4713,7 @@ class DomContainer extends _SharedContainer {
                 if (null !== vnode_getProp(vNode, "q:renderFn", null)) {
                     return vNode;
                 }
-                vNode = vnode_getParent(vNode) || vnode_getProp(vNode, ":", this.$vnodeLocate$);
+                vNode = vnode_getParent(vNode) || vnode_getProp(vNode, ":", this.vNodeLocate);
             } else {
                 vNode = vnode_getParent(vNode);
             }
@@ -4589,7 +4731,7 @@ class DomContainer extends _SharedContainer {
           case "q:props":
           case "q:renderFn":
           case "q:ctx":
-          case "q:subs":
+          case "q:brefs":
             getObjectById = this.$getObjectById$;
             break;
 
@@ -4601,7 +4743,10 @@ class DomContainer extends _SharedContainer {
     }
     scheduleRender() {
         return this.$renderCount$++, this.renderDone ||= getPlatform().nextTick((() => this.processChores())), 
-        this.renderDone;
+        this.renderDone.finally((() => emitEvent("qrender", {
+            instanceHash: this.$instanceHash$,
+            renderCount: this.$renderCount$
+        })));
     }
     processChores() {
         let renderCount = this.$renderCount$;
@@ -4619,16 +4764,17 @@ class DomContainer extends _SharedContainer {
     ensureProjectionResolved(vNode) {
         if (!(vNode[VNodeProps.flags] & VNodeFlags.Resolved)) {
             vNode[VNodeProps.flags] |= VNodeFlags.Resolved;
-            for (let i = vnode_getPropStartIndex(vNode); i < vNode.length; i += 2) {
-                if (isSlotProp(vNode[i])) {
-                    const value = vNode[i + 1];
-                    "string" == typeof value && (vNode[i + 1] = this.$vnodeLocate$(value));
+            const props = vnode_getProps(vNode);
+            for (let i = 0; i < props.length; i += 2) {
+                if (isSlotProp(props[i])) {
+                    const value = props[i + 1];
+                    "string" == typeof value && (props[i + 1] = this.vNodeLocate(value));
                 }
             }
         }
     }
     $getObjectById$=id => ("string" == typeof id && (id = parseFloat(id)), assertTrue(id < this.$rawStateData$.length / 2, `Invalid reference: ${id} >= ${this.$rawStateData$.length / 2}`), 
-    this.stateData[id]);
+    this.$stateData$[id]);
     getSyncFn(id) {
         const fn = this.$qFuncs$[id];
         return assertTrue("function" == typeof fn, "Invalid reference: " + id), fn;
@@ -4760,7 +4906,7 @@ const inflate = (container, target, typeId, data) => {
         const task = target;
         const v = data;
         task.$qrl$ = inflateQRL(container, v[0]), task.$flags$ = v[1], task.$index$ = v[2], 
-        task.$el$ = v[3], task.$effectDependencies$ = v[4], task.$state$ = v[5];
+        task.$el$ = v[3], task[_EFFECT_BACK_REF] = v[4], task.$state$ = v[5];
         break;
 
       case TypeIds.Resource:
@@ -4778,11 +4924,9 @@ const inflate = (container, target, typeId, data) => {
       case TypeIds.Store:
       case TypeIds.StoreArray:
         {
-            const [value, flags, effects, storeEffect] = data;
+            const [value, flags, effects] = data;
             const store = getOrCreateStore(value, flags, container);
-            const storeHandler = getStoreHandler(store);
-            storeEffect && (effects[STORE_ARRAY_PROP] = storeEffect), storeHandler.$effects$ = effects, 
-            target = store;
+            getStoreHandler(store).$effects$ = effects, target = store;
             break;
         }
 
@@ -4790,7 +4934,7 @@ const inflate = (container, target, typeId, data) => {
         {
             const signal = target;
             const d = data;
-            signal.$untrackedValue$ = d[0], signal.$effects$ = d.slice(1);
+            signal.$untrackedValue$ = d[0], signal.$effects$ = new Set(d.slice(1));
             break;
         }
 
@@ -4798,8 +4942,8 @@ const inflate = (container, target, typeId, data) => {
         {
             const signal = target;
             const d = data;
-            signal.$func$ = container.getSyncFn(d[0]), signal.$args$ = d[1], signal.$effectDependencies$ = d[2], 
-            signal.$untrackedValue$ = d[3], signal.$hostElement$ = d[4], signal.$effects$ = d.slice(5);
+            signal.$func$ = container.getSyncFn(d[0]), signal.$args$ = d[1], signal[_EFFECT_BACK_REF] = d[2], 
+            signal.$untrackedValue$ = d[3], signal.$hostElement$ = d[4], signal.$effects$ = new Set(d.slice(5));
             break;
         }
 
@@ -4903,7 +5047,7 @@ const inflate = (container, target, typeId, data) => {
     return target;
 };
 
-const _constants = [ void 0, null, !0, !1, "", EMPTY_ARRAY, EMPTY_OBJ, NEEDS_COMPUTATION, Slot, Fragment, NaN, 1 / 0, -1 / 0, Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER - 1, Number.MIN_SAFE_INTEGER ];
+const _constants = [ void 0, null, !0, !1, "", EMPTY_ARRAY, EMPTY_OBJ, NEEDS_COMPUTATION, STORE_ARRAY_PROP, Slot, Fragment, NaN, 1 / 0, -1 / 0, Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER - 1, Number.MIN_SAFE_INTEGER ];
 
 const allocate = (container, typeId, value) => {
     if (void 0 === value) {
@@ -4993,7 +5137,7 @@ const allocate = (container, typeId, value) => {
         const promise = new Promise(((res, rej) => {
             resolve = res, reject = rej;
         }));
-        return resolvers.set(promise, [ resolve, reject ]), promise;
+        return resolvers.set(promise, [ resolve, reject ]), promise.catch((() => {})), promise;
 
       case TypeIds.Uint8Array:
         const encodedLength = value.length;
@@ -5003,12 +5147,10 @@ const allocate = (container, typeId, value) => {
       case TypeIds.PropsProxy:
         return createPropsProxy(null, null);
 
-      case TypeIds.RefVNode:
       case TypeIds.VNode:
-        const vnodeOrDocument = retrieveVNodeOrDocument(container, value);
-        if (typeId === TypeIds.VNode) {
-            return vnodeOrDocument;
-        }
+        return retrieveVNodeOrDocument(container, value);
+
+      case TypeIds.RefVNode:
         const vNode = retrieveVNodeOrDocument(container, value);
         if (vnode_isVNode(vNode)) {
             return vnode_getNode(vNode);
@@ -5016,7 +5158,7 @@ const allocate = (container, typeId, value) => {
         throw qError(QError.serializeErrorExpectedVNode, [ typeof vNode ]);
 
       case TypeIds.EffectData:
-        return new EffectPropData({});
+        return new SubscriptionData({});
 
       default:
         throw qError(QError.serializeErrorCannotAllocate, [ typeId ]);
@@ -5039,7 +5181,7 @@ function parseQRL(qrl) {
         const backChannel = globalThis[QRL_RUNTIME_CHUNK];
         assertDefined(backChannel, "Missing QRL_RUNTIME_CHUNK"), qrlRef = backChannel.get(symbol);
     }
-    return createQRL(chunk, symbol, qrlRef, null, captureIds, null, null);
+    return createQRL(chunk, symbol, qrlRef, null, captureIds, null);
 }
 
 function inflateQRL(container, qrl) {
@@ -5117,18 +5259,18 @@ const createSerializationContext = (NodeConstructor, DomRefConstructor, symbolTo
             const promises = [];
             const visit = obj => {
                 if ("function" == typeof obj) {
-                    if (isQrl(obj)) {
+                    if (isQrl$1(obj)) {
                         obj.$captureRef$ && discoveredValues.push(...obj.$captureRef$);
                     } else if (isQwikComponent(obj)) {
                         const [qrl] = obj[SERIALIZABLE_STATE];
                         discoveredValues.push(qrl);
                     }
-                } else if ("object" != typeof obj || null === obj || obj instanceof URL || obj instanceof Date || obj instanceof RegExp || obj instanceof Uint8Array || obj instanceof URLSearchParams || "undefined" != typeof FormData && obj instanceof FormData || fastSkipSerialize(obj)) {} else if (obj instanceof Error) {
+                } else if ("object" != typeof obj || null === obj || obj instanceof URL || obj instanceof Date || obj instanceof RegExp || obj instanceof Uint8Array || obj instanceof URLSearchParams || vnode_isVNode(obj) || "undefined" != typeof FormData && obj instanceof FormData || fastSkipSerialize(obj)) {} else if (obj instanceof Error) {
                     discoveredValues.push(...Object.values(obj));
                 } else if (isStore(obj)) {
                     const target = getStoreTarget(obj);
                     const effects = getStoreHandler(obj).$effects$;
-                    discoveredValues.push(target, effects, effects?.[STORE_ARRAY_PROP] ?? null);
+                    discoveredValues.push(target, effects);
                     for (const prop in target) {
                         const propValue = target[prop];
                         storeProxyMap.has(propValue) && discoveredValues.push(prop, storeProxyMap.get(propValue));
@@ -5142,10 +5284,10 @@ const createSerializationContext = (NodeConstructor, DomRefConstructor, symbolTo
                 } else if (obj instanceof Signal) {
                     const v = obj instanceof WrappedSignal ? obj.untrackedValue : obj instanceof ComputedSignal && (obj.$invalid$ || fastSkipSerialize(obj)) ? NEEDS_COMPUTATION : obj.$untrackedValue$;
                     v !== NEEDS_COMPUTATION && discoveredValues.push(v), obj.$effects$ && discoveredValues.push(...obj.$effects$), 
-                    obj instanceof WrappedSignal ? (obj.$effectDependencies$ && discoveredValues.push(...obj.$effectDependencies$), 
+                    obj instanceof WrappedSignal ? (discoverEffectBackRefs(obj[_EFFECT_BACK_REF], discoveredValues), 
                     obj.$args$ && discoveredValues.push(...obj.$args$), obj.$hostElement$ && discoveredValues.push(obj.$hostElement$)) : obj instanceof ComputedSignal && discoveredValues.push(obj.$computeQrl$);
                 } else if (obj instanceof Task) {
-                    discoveredValues.push(obj.$el$, obj.$qrl$, obj.$state$, obj.$effectDependencies$);
+                    discoveredValues.push(obj.$el$, obj.$qrl$, obj.$state$), discoverEffectBackRefs(obj[_EFFECT_BACK_REF], discoveredValues);
                 } else if (isSsrNode(obj)) {
                     if (discoverValuesForVNodeData(obj.vnodeData, discoveredValues), obj.childrenVNodeData && obj.childrenVNodeData.length) {
                         for (const data of obj.childrenVNodeData) {
@@ -5158,7 +5300,7 @@ const createSerializationContext = (NodeConstructor, DomRefConstructor, symbolTo
                     discoveredValues.push(obj.type, obj.props, obj.constProps, obj.children);
                 } else if (Array.isArray(obj)) {
                     discoveredValues.push(...obj);
-                } else if (isQrl(obj)) {
+                } else if (isQrl$1(obj)) {
                     obj.$captureRef$ && obj.$captureRef$.length && discoveredValues.push(...obj.$captureRef$);
                 } else if (isPropsProxy(obj)) {
                     discoveredValues.push(obj[_VAR_PROPS], obj[_CONST_PROPS]);
@@ -5168,7 +5310,7 @@ const createSerializationContext = (NodeConstructor, DomRefConstructor, symbolTo
                     }), (error => {
                         promiseResults.set(obj, [ !1, error ]), discoveredValues.push(error);
                     })), promises.push(obj);
-                } else if (obj instanceof EffectPropData) {
+                } else if (obj instanceof SubscriptionData) {
                     discoveredValues.push(obj.data);
                 } else {
                     if (!isObjectLiteral(obj)) {
@@ -5211,12 +5353,23 @@ const discoverValuesForVNodeData = (vnodeData, discoveredValues) => {
     for (const value of vnodeData) {
         if (isSsrAttrs(value)) {
             for (let i = 1; i < value.length; i += 2) {
-                if ("q:key" === value[i - 1]) {
-                    continue;
-                }
-                discoveredValues.push(value[i]);
+                const attrValue = value[i];
+                "string" != typeof attrValue && discoveredValues.push(attrValue);
+            }
+        }
+    }
+};
+
+const discoverEffectBackRefs = (effectsBackRefs, discoveredValues) => {
+    if (effectsBackRefs) {
+        let hasBackRefs = !1;
+        for (const [, effect] of effectsBackRefs) {
+            if (effect[EffectSubscriptionProp.BACK_REF]) {
+                hasBackRefs = !0;
+                break;
             }
         }
+        hasBackRefs && discoveredValues.push(effectsBackRefs);
     }
 };
 
@@ -5258,7 +5411,7 @@ function serialize(serializationContext) {
                 output(TypeIds.Constant, Constants.Slot);
             } else if (value === Fragment) {
                 output(TypeIds.Constant, Constants.Fragment);
-            } else if (isQrl(value)) {
+            } else if (isQrl$1(value)) {
                 const qrl = qrlToString(serializationContext, value);
                 const id = serializationContext.$addRoot$(qrl);
                 output(TypeIds.QRL, id);
@@ -5284,11 +5437,13 @@ function serialize(serializationContext) {
             }
         } else if (void 0 === value) {
             output(TypeIds.Constant, Constants.Undefined);
+        } else if (value === NEEDS_COMPUTATION) {
+            output(TypeIds.Constant, Constants.NEEDS_COMPUTATION);
         } else {
-            if (value !== NEEDS_COMPUTATION) {
+            if (value !== STORE_ARRAY_PROP) {
                 throw qError(QError.serializeErrorUnknownType, [ typeof value ]);
             }
-            output(TypeIds.Constant, Constants.NEEDS_COMPUTATION);
+            output(TypeIds.Constant, Constants.STORE_ARRAY_PROP);
         }
     };
     const writeObjectValue = (value, idx) => {
@@ -5304,7 +5459,7 @@ function serialize(serializationContext) {
             const constProps = value[_CONST_PROPS];
             const out = constProps ? [ varProps, constProps ] : Object.keys(varProps).length ? [ varProps ] : 0;
             output(TypeIds.PropsProxy, out);
-        } else if (value instanceof EffectPropData) {
+        } else if (value instanceof SubscriptionData) {
             output(TypeIds.EffectData, [ value.data.$scopedStyleIdPrefix$, value.data.$isConst$ ]);
         } else if (isStore(value)) {
             if (isResource(value)) {
@@ -5319,7 +5474,6 @@ function serialize(serializationContext) {
                 const storeTarget = getStoreTarget(value);
                 const flags = storeHandler.$flags$;
                 const effects = storeHandler.$effects$;
-                const storeEffect = effects?.[STORE_ARRAY_PROP] ?? null;
                 const innerStores = [];
                 for (const prop in storeTarget) {
                     const propValue = storeTarget[prop];
@@ -5328,7 +5482,7 @@ function serialize(serializationContext) {
                         innerStores.push(innerStore), serializationContext.$addRoot$(innerStore);
                     }
                 }
-                const out = [ storeTarget, flags, effects, storeEffect, ...innerStores ];
+                const out = [ storeTarget, flags, effects, ...innerStores ];
                 for (;null == out[out.length - 1]; ) {
                     out.pop();
                 }
@@ -5349,7 +5503,7 @@ function serialize(serializationContext) {
         } else if (value instanceof Signal) {
             const v = value instanceof ComputedSignal && (value.$invalid$ || fastSkipSerialize(value.$untrackedValue$)) ? NEEDS_COMPUTATION : value.$untrackedValue$;
             if (value instanceof WrappedSignal) {
-                output(TypeIds.WrappedSignal, [ ...serializeWrappingFn(serializationContext, value), value.$effectDependencies$, v, value.$hostElement$, ...value.$effects$ || [] ]);
+                output(TypeIds.WrappedSignal, [ ...serializeWrappingFn(serializationContext, value), filterEffectBackRefs(value[_EFFECT_BACK_REF]), v, value.$hostElement$, ...value.$effects$ || [] ]);
             } else if (value instanceof ComputedSignal) {
                 const out = [ value.$computeQrl$, value.$effects$ ];
                 v !== NEEDS_COMPUTATION && out.push(v), output(TypeIds.ComputedSignal, out);
@@ -5397,7 +5551,7 @@ function serialize(serializationContext) {
         } else if (isJSXNode(value)) {
             output(TypeIds.JSXNode, [ value.type, value.varProps, value.constProps, value.children, value.flags, value.key ]);
         } else if (value instanceof Task) {
-            const out = [ value.$qrl$, value.$flags$, value.$index$, value.$el$, value.$effectDependencies$, value.$state$ ];
+            const out = [ value.$qrl$, value.$flags$, value.$index$, value.$el$, value[_EFFECT_BACK_REF], value.$state$ ];
             for (;null == out[out.length - 1]; ) {
                 out.pop();
             }
@@ -5408,23 +5562,34 @@ function serialize(serializationContext) {
                 throw qError(QError.serializeErrorUnvisited, [ "promise" ]);
             }
             output(TypeIds.Promise, res);
+        } else if (value instanceof Uint8Array) {
+            let buf = "";
+            for (const c of value) {
+                buf += String.fromCharCode(c);
+            }
+            const out = btoa(buf).replace(/=+$/, "");
+            output(TypeIds.Uint8Array, out);
         } else {
-            if (!(value instanceof Uint8Array)) {
+            if (!vnode_isVNode(value)) {
                 throw qError(QError.serializeErrorUnknownType, [ typeof value ]);
             }
-            {
-                let buf = "";
-                for (const c of value) {
-                    buf += String.fromCharCode(c);
-                }
-                const out = btoa(buf).replace(/=+$/, "");
-                output(TypeIds.Uint8Array, out);
-            }
+            output(TypeIds.Constant, Constants.Undefined);
         }
     };
     writeValue(serializationContext.$roots$, -1);
 }
 
+function filterEffectBackRefs(effectBackRef) {
+    let effectBackRefToSerialize = null;
+    if (effectBackRef) {
+        for (const [effectProp, effect] of effectBackRef) {
+            effect[EffectSubscriptionProp.BACK_REF] && (effectBackRefToSerialize ||= new Map, 
+            effectBackRefToSerialize.set(effectProp, effect));
+        }
+    }
+    return effectBackRefToSerialize;
+}
+
 function serializeWrappingFn(serializationContext, value) {
     value.$funcStr$ && "{" === value.$funcStr$[0] && (value.$funcStr$ = `(${value.$funcStr$})`);
     return [ serializationContext.$addSyncFn$(value.$funcStr$, value.$args$.length, value.$func$), value.$args$ ];
@@ -5433,11 +5598,10 @@ function serializeWrappingFn(serializationContext, value) {
 function qrlToString(serializationContext, value) {
     let symbol = value.$symbol$;
     let chunk = value.$chunk$;
-    const refSymbol = value.$refSymbol$ ?? symbol;
     const platform = getPlatform();
     if (platform) {
-        const result = platform.chunkForSymbol(refSymbol, chunk, value.dev?.file);
-        result && (chunk = result[1], value.$refSymbol$ || (symbol = result[0]));
+        const result = platform.chunkForSymbol(symbol, chunk, value.dev?.file);
+        result && (chunk = result[1], symbol = result[0]);
     }
     if (isSyncQrl(value)) {
         chunk = "", symbol = String(serializationContext.$addSyncFn$(null, 0, value.resolved));
@@ -5531,17 +5695,21 @@ function isResource(value) {
     return "__brand" in value && "resource" === value.__brand;
 }
 
-const frameworkType = obj => "object" == typeof obj && null !== obj && (obj instanceof Signal || obj instanceof Task || isJSXNode(obj)) || isQrl(obj);
+const frameworkType = obj => "object" == typeof obj && null !== obj && (obj instanceof Signal || obj instanceof Task || isJSXNode(obj)) || isQrl$1(obj);
 
-const canSerialize = value => {
+const canSerialize = (value, seen = new WeakSet) => {
     if (null == value || "string" == typeof value || "number" == typeof value || "boolean" == typeof value || "bigint" == typeof value) {
         return !0;
     }
     if ("object" == typeof value) {
+        if (seen.has(value)) {
+            return !0;
+        }
+        seen.add(value);
         const proto = Object.getPrototypeOf(value);
         if (isStore(value) && (value = getStoreTarget(value)), proto == Object.prototype) {
             for (const key in value) {
-                if (!canSerialize(untrack((() => value[key])))) {
+                if (!canSerialize(untrack((() => value[key])), seen)) {
                     return !1;
                 }
             }
@@ -5549,7 +5717,7 @@ const canSerialize = value => {
         }
         if (proto == Array.prototype) {
             for (let i = 0; i < value.length; i++) {
-                if (!canSerialize(value[i])) {
+                if (!canSerialize(value[i], seen)) {
                     return !1;
                 }
             }
@@ -5597,7 +5765,7 @@ const canSerialize = value => {
         if (isDomRef?.(value)) {
             return !0;
         }
-    } else if ("function" == typeof value && (isQrl(value) || isQwikComponent(value))) {
+    } else if ("function" == typeof value && (isQrl$1(value) || isQwikComponent(value))) {
         return !0;
     }
     return !1;
@@ -5629,14 +5797,15 @@ var Constants;
     Constants[Constants.True = 2] = "True", Constants[Constants.False = 3] = "False", 
     Constants[Constants.EmptyString = 4] = "EmptyString", Constants[Constants.EMPTY_ARRAY = 5] = "EMPTY_ARRAY", 
     Constants[Constants.EMPTY_OBJ = 6] = "EMPTY_OBJ", Constants[Constants.NEEDS_COMPUTATION = 7] = "NEEDS_COMPUTATION", 
-    Constants[Constants.Slot = 8] = "Slot", Constants[Constants.Fragment = 9] = "Fragment", 
-    Constants[Constants.NaN = 10] = "NaN", Constants[Constants.PositiveInfinity = 11] = "PositiveInfinity", 
-    Constants[Constants.NegativeInfinity = 12] = "NegativeInfinity", Constants[Constants.MaxSafeInt = 13] = "MaxSafeInt", 
-    Constants[Constants.AlmostMaxSafeInt = 14] = "AlmostMaxSafeInt", Constants[Constants.MinSafeInt = 15] = "MinSafeInt";
+    Constants[Constants.STORE_ARRAY_PROP = 8] = "STORE_ARRAY_PROP", Constants[Constants.Slot = 9] = "Slot", 
+    Constants[Constants.Fragment = 10] = "Fragment", Constants[Constants.NaN = 11] = "NaN", 
+    Constants[Constants.PositiveInfinity = 12] = "PositiveInfinity", Constants[Constants.NegativeInfinity = 13] = "NegativeInfinity", 
+    Constants[Constants.MaxSafeInt = 14] = "MaxSafeInt", Constants[Constants.AlmostMaxSafeInt = 15] = "AlmostMaxSafeInt", 
+    Constants[Constants.MinSafeInt = 16] = "MinSafeInt";
 }(Constants || (Constants = {}));
 
 const verifySerializable = (value, preMessage) => {
-    const seen = new Set;
+    const seen = new WeakSet;
     return _verifySerializable(value, seen, "_", preMessage);
 };
 
@@ -5646,10 +5815,13 @@ const _verifySerializable = (value, seen, ctx, preMessage) => {
         return value;
     }
     if (shouldSerialize(unwrapped)) {
-        if (seen.has(unwrapped)) {
-            return value;
+        if ("object" == typeof unwrapped) {
+            if (seen.has(unwrapped)) {
+                return value;
+            }
+            seen.add(unwrapped);
         }
-        if (seen.add(unwrapped), isSignal(unwrapped)) {
+        if (isSignal(unwrapped)) {
             return value;
         }
         if (canSerialize(unwrapped)) {
@@ -5711,13 +5883,7 @@ const noSerialize = input => (null != input && noSerializeSet.add(input), input)
 
 const _weakSerialize = input => (weakSerializeSet.add(input), input);
 
-const isQrl = value => "function" == typeof value && "function" == typeof value.getSymbol;
-
-const SYNC_QRL = "<sync>";
-
-const isSyncQrl = value => isQrl(value) && "<sync>" == value.$symbol$;
-
-const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef, refSymbol) => {
+const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef) => {
     let _containerEl;
     const qrl = async function(...args) {
         const boundedFn = bindFnToContext.call(this, tryGetInvokeContext());
@@ -5725,9 +5891,14 @@ const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef, refS
     };
     const setContainer = el => (_containerEl || (_containerEl = el), _containerEl);
     function bindFnToContext(currentCtx, beforeFn) {
-        return (...args) => maybeThen(resolveLazy(), (fn => {
-            if (!isFunction(fn)) {
-                throw qError(QError.qrlIsNotFunction);
+        const bound = (...args) => {
+            if (!qrl.resolved) {
+                return qrl.resolve().then((fn => {
+                    if (!isFunction(fn)) {
+                        throw qError(QError.qrlIsNotFunction);
+                    }
+                    return bound(...args);
+                }));
             }
             if (beforeFn && !1 === beforeFn()) {
                 return;
@@ -5737,17 +5908,29 @@ const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef, refS
             const prevEvent = context.$event$;
             context.$qrl$ = qrl, context.$event$ ||= this;
             try {
-                return invoke.call(this, context, fn, ...args);
+                return invoke.call(this, context, symbolRef, ...args);
             } finally {
                 context.$qrl$ = prevQrl, context.$event$ = prevEvent;
             }
-        }));
+        };
+        return bound;
     }
-    const resolveLazy = containerEl => null !== symbolRef ? symbolRef : resolve(containerEl);
     const wrapFn = fn => "function" != typeof fn || !capture?.length && !captureRef?.length ? fn : function(...args) {
         let context = tryGetInvokeContext();
-        return context ? fn.apply(this, args) : (context = newInvokeContext(), context.$qrl$ = qrl, 
-        context.$event$ = this, invoke.call(this, context, fn, ...args));
+        if (context) {
+            if (context.$qrl$?.$symbol$ === qrl.$symbol$) {
+                return fn.apply(this, args);
+            }
+            const prevQrl = context.$qrl$;
+            context.$qrl$ = qrl;
+            try {
+                return fn.apply(this, args);
+            } finally {
+                context.$qrl$ = prevQrl;
+            }
+        }
+        return context = newInvokeContext(), context.$qrl$ = qrl, context.$event$ = this, 
+        invoke.call(this, context, fn, ...args);
     };
     const resolve = async containerEl => {
         if (null !== symbolRef) {
@@ -5762,49 +5945,38 @@ const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef, refS
         const start = now();
         const ctx = tryGetInvokeContext();
         if (null !== symbolFn) {
-            symbolRef = symbolFn().then((module => qrl.resolved = symbolRef = wrapFn(module[symbol])));
+            symbolRef = symbolFn().then((module => qrl.resolved = wrapFn(symbolRef = module[symbol])));
         } else {
             const imported = getPlatform().importSymbol(_containerEl, chunk, symbol);
-            symbolRef = maybeThen(imported, (ref => qrl.resolved = symbolRef = wrapFn(ref)));
+            symbolRef = maybeThen(imported, (ref => qrl.resolved = wrapFn(symbolRef = ref)));
         }
         return "object" == typeof symbolRef && isPromise(symbolRef) && symbolRef.then((() => emitUsedSymbol(symbol, ctx?.$element$, start)), (err => {
             throw console.error(`qrl ${symbol} failed to load`, err), symbolRef = null, err;
         })), symbolRef;
     };
     const createOrReuseInvocationContext = invoke => null == invoke ? newInvokeContext() : isArray(invoke) ? newInvokeContextFromTuple(invoke) : invoke;
-    const resolvedSymbol = refSymbol ?? symbol;
-    const hash = getSymbolHash(resolvedSymbol);
+    const hash = getSymbolHash(symbol);
     return Object.assign(qrl, {
-        getSymbol: () => resolvedSymbol,
+        getSymbol: () => symbol,
         getHash: () => hash,
         getCaptured: () => captureRef,
         resolve,
-        $resolveLazy$: resolveLazy,
+        $resolveLazy$: containerEl => null !== symbolRef ? symbolRef : resolve(containerEl),
         $setContainer$: setContainer,
         $chunk$: chunk,
         $symbol$: symbol,
-        $refSymbol$: refSymbol,
         $hash$: hash,
         getFn: bindFnToContext,
         $capture$: capture,
         $captureRef$: captureRef,
         dev: null,
         resolved: void 0
-    }), symbolRef && (symbolRef = maybeThen(symbolRef, (resolved => qrl.resolved = symbolRef = wrapFn(resolved)))), 
+    }), symbolRef && (symbolRef = maybeThen(symbolRef, (resolved => qrl.resolved = wrapFn(symbolRef = resolved)))), 
     isDev && Object.defineProperty(qrl, "_devOnlySymbolRef", {
         get: () => symbolRef
     }), qrl;
 };
 
-const getSymbolHash = symbolName => {
-    const index = symbolName.lastIndexOf("_");
-    return index > -1 ? symbolName.slice(index + 1) : symbolName;
-};
-
-function assertQrl() {
-    qDev;
-}
-
 const EMITTED = /*#__PURE__*/ new Set;
 
 const emitUsedSymbol = (symbol, element, reqTime) => {
@@ -5826,17 +5998,17 @@ const now = () => isServerPlatform() ? 0 : "object" == typeof performance ? perf
 
 let runtimeSymbolId = 0;
 
-const $ = expression => createQRL(null, "s" + runtimeSymbolId++, expression, null, null, null, null);
+const $ = expression => createQRL(null, "s" + runtimeSymbolId++, expression, null, null, null);
 
 const dollar = $;
 
 const eventQrl = qrl => qrl;
 
-const sync$ = fn => createQRL("", "<sync>", fn, null, null, null, null);
+const sync$ = fn => createQRL("", "<sync>", fn, null, null, null);
 
 const _qrlSync = function(fn, serializedFn) {
     return void 0 === serializedFn && (serializedFn = fn.toString()), fn.serialized = serializedFn, 
-    createQRL("", "<sync>", fn, null, null, null, null);
+    createQRL("", "<sync>", fn, null, null, null);
 };
 
 const componentQrl = componentQrl => {
@@ -5966,7 +6138,7 @@ const scopeStylesheet = (css, scopeId) => {
         out.push(css.substring(lastIdx, idx)), lastIdx = idx;
     }
     function insertScopingSelector(idx) {
-        mode === pseudoGlobal || shouldNotInsertScoping() || (flush(idx), out.push(".", "⭐️", scopeId));
+        mode === pseudoGlobal || shouldNotInsertScoping() || (flush(idx), out.push(".", "⚡️", scopeId));
     }
     function lookAhead(arc) {
         let prefix = 0;
@@ -6117,7 +6289,7 @@ const useStylesQrl = styles => ({
 const useStyles$ = /*#__PURE__*/ implicit$FirstArg(useStylesQrl);
 
 const useStylesScopedQrl = styles => ({
-    scopeId: "⭐️" + _useStyles(styles, getScopedStyles, !0)
+    scopeId: "⚡️" + _useStyles(styles, getScopedStyles, !0)
 });
 
 const useStylesScoped$ = /*#__PURE__*/ implicit$FirstArg(useStylesScopedQrl);
@@ -6172,6 +6344,12 @@ const useVisibleTaskQrl = (qrl, opts) => {
     iCtx.$container$.$scheduler$(ChoreType.VISIBLE, task));
 };
 
+const useRunTask = (task, eagerness) => {
+    "intersection-observer" === eagerness ? useOn("qvisible", getTaskHandlerQrl(task)) : "document-ready" === eagerness ? useOnDocument("qinit", getTaskHandlerQrl(task)) : "document-idle" === eagerness && useOnDocument("qidle", getTaskHandlerQrl(task));
+};
+
+const getTaskHandlerQrl = task => createQRL(null, "_task", scheduleTask, null, null, [ task ]);
+
 const useResource$ = (generatorFn, opts) => useResourceQrl(dollar(generatorFn), opts);
 
 const useTask$ = /*#__PURE__*/ implicit$FirstArg(useTaskQrl);
@@ -6244,4 +6422,4 @@ const PrefetchGraph = (opts = {}) => {
     }, null, 0, "prefetch-graph");
 };
 
-export { $, Fragment, PrefetchGraph, PrefetchServiceWorker, RenderOnce, Resource, SSRComment, SSRRaw, SSRStream, SSRStreamBlock, SkipRender, Slot, _CONST_PROPS, DomContainer as _DomContainer, EMPTY_ARRAY as _EMPTY_ARRAY, EffectPropData as _EffectData, _IMMUTABLE, _SharedContainer, _VAR_PROPS, _deserialize, _fnSignal, _getContextElement, _getContextEvent, getDomContainer as _getDomContainer, _getQContainerElement, _hW, isJSXNode as _isJSXNode, isStringifiable as _isStringifiable, _jsxBranch, _jsxC, _jsxQ, _jsxS, _jsxSorted, _jsxSplit, _noopQrl, _noopQrlDEV, _qrlSync, _regSymbol, _restProps, _serialize, verifySerializable as _verifySerializable, _waitUntilRendered, _walkJSX, _weakSerialize, _wrapProp, _wrapSignal, component$, componentQrl, createComputed$, createComputedQrl, createContextId, h as createElement, 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, useComputed$, useComputedQrl, useConstant, useContext, useContextProvider, useErrorBoundary, useId, useLexicalScope, useOn, useOnDocument, useOnWindow, useResource$, useResourceQrl, useServerData, useSignal, useStore, useStyles$, useStylesQrl, useStylesScoped$, useStylesScopedQrl, useTask$, useTaskQrl, useVisibleTask$, useVisibleTaskQrl, version, withLocale };
+export { $, Fragment, PrefetchGraph, PrefetchServiceWorker, RenderOnce, Resource, SSRComment, SSRRaw, SSRStream, SSRStreamBlock, SkipRender, Slot, _CONST_PROPS, DomContainer as _DomContainer, _EFFECT_BACK_REF, EMPTY_ARRAY as _EMPTY_ARRAY, SubscriptionData as _EffectData, _IMMUTABLE, _SharedContainer, _VAR_PROPS, _deserialize, _fnSignal, _getContextElement, _getContextEvent, getDomContainer as _getDomContainer, _getQContainerElement, isJSXNode as _isJSXNode, isStringifiable as _isStringifiable, _jsxBranch, _jsxC, _jsxQ, _jsxS, _jsxSorted, _jsxSplit, _noopQrl, _noopQrlDEV, _qrlSync, _regSymbol, _restProps, queueQRL as _run, _serialize, scheduleTask as _task, verifySerializable as _verifySerializable, _waitUntilRendered, _walkJSX, _weakSerialize, _wrapProp, _wrapSignal, component$, componentQrl, createComputed$, createComputedQrl, createContextId, h as createElement, 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, useComputed$, useComputedQrl, useConstant, useContext, useContextProvider, useErrorBoundary, useId, useLexicalScope, useOn, useOnDocument, useOnWindow, useResource$, useResourceQrl, useServerData, useSignal, useStore, useStyles$, useStylesQrl, useStylesScoped$, useStylesScopedQrl, useTask$, useTaskQrl, useVisibleTask$, useVisibleTaskQrl, version, withLocale };