@qwik.dev/core 2.0.0-alpha.4 → 2.0.0-alpha.6

package/dist/optimizer.cjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core/optimizer 2.0.0-alpha.4-dev+374e0d6
+ * @qwik.dev/core/optimizer 2.0.0-alpha.6-dev+d848ba5
  * 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
@@ -1226,7 +1226,7 @@ globalThis.qwikOptimizer = function(module) {
   }
   var QWIK_BINDING_MAP = {};
   var versions = {
-    qwik: "2.0.0-alpha.4-dev+374e0d6"
+    qwik: "2.0.0-alpha.6-dev+d848ba5"
   };
   async function getSystem() {
     const sysEnv = getEnv();
@@ -2872,7 +2872,7 @@ globalThis.qwikOptimizer = function(module) {
   }
   var codeToText = (code, ...parts) => {
     if (qDev) {
-      const MAP = [ "Error while serializing class or style attributes", "", "", "Only primitive and object literals can be serialized. {{0}}", "", "You can render over a existing q:container. Skipping render().", "", "", "", "", "QRL is not a function", "Dynamic import not found", "Unknown type argument", "Actual value for useContext({{0}}) can not be found, make sure some ancestor component has set a value using useContextProvider(). In the browser make sure that the context was used during SSR so its state was serialized.", "Invoking 'use*()' method outside of invocation context.", "", "", "", "", "", "Calling a 'use*()' method outside 'component$(() => { HERE })' is not allowed. 'use*()' methods provide hooks to the 'component$' state and lifecycle, ie 'use' hooks can only be called synchronously within the 'component$' function or another 'use' method.\nSee https://qwik.dev/docs/components/tasks/#use-method-rules", "", "", "", "", "", "", "", 'The provided Context reference "{{0}}" is not a valid context created by createContextId()', "SsrError(tag): {{0}}", "QRLs can not be resolved because it does not have an attached container. This means that the QRL does not know where it belongs inside the DOM, so it cant dynamically import() from a relative path.", "QRLs can not be dynamically resolved, because it does not have a chunk path", "The JSX ref attribute must be a Signal", "Serialization Error: Deserialization of data type {{0}} is not implemented", "Serialization Error: Expected vnode for ref prop, but got {{0}}", "Serialization Error: Cannot allocate data type {{0}}", "Serialization Error: Missing root id for {{0}}", "Serialization Error: Serialization of data type {{0}} is not implemented", "Serialization Error: Unvisited {{0}}", "Serialization Error: Missing QRL chunk for {{0}}", "The value of the textarea must be a string", "Unable to find q:container", "Element must have 'q:container' attribute.", "Unknown vnode type {{0}}.", "Materialize error: missing element: {{0}} {{1}} {{2}}", "SsrError: {{0}}", "Cannot coerce a Signal, use `.value` instead", "useComputedSignal$ QRL {{0}} {{1}} returned a Promise", "ComputedSignal is read-only", "WrappedSignal is read-only", "SsrError: Promises not expected here.", "Attribute value is unsafe for SSR" ];
+      const MAP = [ "Error while serializing class or style attributes", "", "", "Only primitive and object literals can be serialized. {{0}}", "", "You can render over a existing q:container. Skipping render().", "", "", "", "", "QRL is not a function", "Dynamic import not found", "Unknown type argument", "Actual value for useContext({{0}}) can not be found, make sure some ancestor component has set a value using useContextProvider(). In the browser make sure that the context was used during SSR so its state was serialized.", "Invoking 'use*()' method outside of invocation context.", "", "", "", "", "", "Calling a 'use*()' method outside 'component$(() => { HERE })' is not allowed. 'use*()' methods provide hooks to the 'component$' state and lifecycle, ie 'use' hooks can only be called synchronously within the 'component$' function or another 'use' method.\nSee https://qwik.dev/docs/components/tasks/#use-method-rules", "", "", "", "", "", "", "", 'The provided Context reference "{{0}}" is not a valid context created by createContextId()', "SsrError(tag): {{0}}", "QRLs can not be resolved because it does not have an attached container. This means that the QRL does not know where it belongs inside the DOM, so it cant dynamically import() from a relative path.", "QRLs can not be dynamically resolved, because it does not have a chunk path", "{{0}}\nThe JSX ref attribute must be a Signal", "Serialization Error: Deserialization of data type {{0}} is not implemented", "Serialization Error: Expected vnode for ref prop, but got {{0}}", "Serialization Error: Cannot allocate data type {{0}}", "Serialization Error: Missing root id for {{0}}", "Serialization Error: Serialization of data type {{0}} is not implemented", "Serialization Error: Unvisited {{0}}", "Serialization Error: Missing QRL chunk for {{0}}", "{{0}}\nThe value of the textarea must be a string found {{1}}", "Unable to find q:container", "Element must have 'q:container' attribute.", "Unknown vnode type {{0}}.", "Materialize error: missing element: {{0}} {{1}} {{2}}", "Cannot coerce a Signal, use `.value` instead", "useComputedSignal$ QRL {{0}} {{1}} returned a Promise", "ComputedSignal is read-only", "WrappedSignal is read-only", "SsrError: Promises not expected here.", "Attribute value is unsafe for SSR" ];
       let text = MAP[code] ?? "";
       parts.length && (text = text.replaceAll(/{{(\d+)}}/g, ((_, index) => {
         let v = parts[index];
@@ -2887,6 +2887,62 @@ globalThis.qwikOptimizer = function(module) {
     const text = codeToText(code, ...errorMessageArgs);
     return logErrorAndStop(text, ...errorMessageArgs);
   };
+  var DEBUG_TYPE = "q:type";
+  var START = "";
+  var END = "";
+  var VirtualTypeName = {
+    V: START + "Virtual" + END,
+    F: START + "Fragment" + END,
+    S: START + "Signal" + END,
+    A: START + "Awaited" + END,
+    C: START + "Component" + END,
+    I: START + "InlineComponent" + END,
+    P: START + "Projection" + END
+  };
+  var OnRenderProp = "q:renderFn";
+  var ComponentStylesPrefixContent = "⭐️";
+  var QSlot = "q:slot";
+  var QSlotParent = ":";
+  var QSlotRef = "q:sref";
+  var QSlotS = "q:s";
+  var QStyle = "q:style";
+  var QStyleSelector = "style[q\\:style]";
+  var QStyleSSelector = "style[q\\:sstyle]";
+  var QStylesAllSelector = QStyleSelector + "," + QStyleSSelector;
+  var QScopedStyle = "q:sstyle";
+  var QCtxAttr = "q:ctx";
+  var QSubscribers = "q:subs";
+  var QFuncsPrefix = "qFuncs_";
+  var getQFuncs = (document2, hash) => document2[QFuncsPrefix + hash] || [];
+  var QBaseAttr = "q:base";
+  var QLocaleAttr = "q:locale";
+  var QInstanceAttr = "q:instance";
+  var QContainerIsland = "q:container-island";
+  var QContainerIslandEnd = "/" + QContainerIsland;
+  var QIgnore = "q:ignore";
+  var QIgnoreEnd = "/" + QIgnore;
+  var QContainerAttr = "q:container";
+  var QContainerAttrEnd = "/" + QContainerAttr;
+  var QTemplate = "q:template";
+  var QContainerSelector = "[q\\:container]:not([q\\:container=html]):not([q\\:container=text])";
+  var HTML_NS = "http://www.w3.org/1999/xhtml";
+  var SVG_NS = "http://www.w3.org/2000/svg";
+  var MATH_NS = "http://www.w3.org/1998/Math/MathML";
+  var ResourceEvent = "qResource";
+  var RenderEvent = "qRender";
+  var TaskEvent = "qTask";
+  var QDefaultSlot = "";
+  var ELEMENT_ID = "q:id";
+  var ELEMENT_KEY = "q:key";
+  var ELEMENT_PROPS = "q:props";
+  var ELEMENT_SEQ = "q:seq";
+  var ELEMENT_SEQ_IDX = "q:seqIdx";
+  var Q_PREFIX = "q:";
+  var NON_SERIALIZABLE_MARKER_PREFIX = ":";
+  var USE_ON_LOCAL = NON_SERIALIZABLE_MARKER_PREFIX + "on";
+  var USE_ON_LOCAL_SEQ_IDX = NON_SERIALIZABLE_MARKER_PREFIX + "onIdx";
+  var Q_PROPS_SEPARATOR = ":";
+  var dangerouslySetInnerHTML = "dangerouslySetInnerHTML";
   var createPlatform = () => ({
     isServer: isServer,
     importSymbol(containerEl, url, symbolName) {
@@ -2924,7 +2980,7 @@ globalThis.qwikOptimizer = function(module) {
   });
   var toUrl = (doc, containerEl, url) => {
     const baseURI = doc.baseURI;
-    const base = new URL(containerEl.getAttribute("q:base") ?? baseURI, baseURI);
+    const base = new URL(containerEl.getAttribute(QBaseAttr) ?? baseURI, baseURI);
     return new URL(url, base);
   };
   var _platform = createPlatform();
@@ -2955,13 +3011,20 @@ globalThis.qwikOptimizer = function(module) {
     setTimeout(resolve, timeout);
   }));
   function retryOnPromise(fn, retryCount = 0) {
-    try {
-      return fn();
-    } catch (e) {
+    const retryOrThrow = e => {
       if (isPromise(e) && retryCount < MAX_RETRY_ON_PROMISE_COUNT) {
         return e.then(retryOnPromise.bind(null, fn, retryCount++));
       }
       throw e;
+    };
+    try {
+      const result = fn();
+      if (isPromise(result)) {
+        return result.catch((e => retryOrThrow(e)));
+      }
+      return result;
+    } catch (e) {
+      return retryOrThrow(e);
     }
   }
   var isSerializableObject = v => {
@@ -2973,62 +3036,6 @@ globalThis.qwikOptimizer = function(module) {
   var isString = v => "string" === typeof v;
   var isFunction = v => "function" === typeof v;
   var isDev2 = true;
-  var DEBUG_TYPE = "q:type";
-  var START = "";
-  var END = "";
-  var VirtualTypeName = {
-    V: START + "Virtual" + END,
-    F: START + "Fragment" + END,
-    S: START + "Signal" + END,
-    A: START + "Awaited" + END,
-    C: START + "Component" + END,
-    I: START + "InlineComponent" + END,
-    P: START + "Projection" + END
-  };
-  var OnRenderProp = "q:renderFn";
-  var ComponentStylesPrefixContent = "⭐️";
-  var QSlot = "q:slot";
-  var QSlotParent = ":";
-  var QSlotRef = "q:sref";
-  var QSlotS = "q:s";
-  var QStyle = "q:style";
-  var QStyleSelector = "style[q\\:style]";
-  var QStyleSSelector = "style[q\\:sstyle]";
-  var QStylesAllSelector = QStyleSelector + "," + QStyleSSelector;
-  var QScopedStyle = "q:sstyle";
-  var QCtxAttr = "q:ctx";
-  var QSubscribers = "q:subs";
-  var QFuncsPrefix = "qFuncs_";
-  var getQFuncs = (document2, hash) => document2[QFuncsPrefix + hash] || [];
-  var QBaseAttr = "q:base";
-  var QLocaleAttr = "q:locale";
-  var QInstanceAttr = "q:instance";
-  var QContainerIsland = "q:container-island";
-  var QContainerIslandEnd = "/" + QContainerIsland;
-  var QIgnore = "q:ignore";
-  var QIgnoreEnd = "/" + QIgnore;
-  var QContainerAttr = "q:container";
-  var QContainerAttrEnd = "/" + QContainerAttr;
-  var QTemplate = "q:template";
-  var QContainerSelector = "[q\\:container]:not([q\\:container=html]):not([q\\:container=text])";
-  var HTML_NS = "http://www.w3.org/1999/xhtml";
-  var SVG_NS = "http://www.w3.org/2000/svg";
-  var MATH_NS = "http://www.w3.org/1998/Math/MathML";
-  var ResourceEvent = "qResource";
-  var RenderEvent = "qRender";
-  var TaskEvent = "qTask";
-  var QDefaultSlot = "";
-  var ELEMENT_ID = "q:id";
-  var ELEMENT_KEY = "q:key";
-  var ELEMENT_PROPS = "q:props";
-  var ELEMENT_SEQ = "q:seq";
-  var ELEMENT_SEQ_IDX = "q:seqIdx";
-  var Q_PREFIX = "q:";
-  var NON_SERIALIZABLE_MARKER_PREFIX = ":";
-  var USE_ON_LOCAL = NON_SERIALIZABLE_MARKER_PREFIX + "on";
-  var USE_ON_LOCAL_SEQ_IDX = NON_SERIALIZABLE_MARKER_PREFIX + "onIdx";
-  var Q_PROPS_SEPARATOR = ":";
-  var dangerouslySetInnerHTML = "dangerouslySetInnerHTML";
   function setLocale(locale) {
     0;
   }
@@ -3254,7 +3261,6 @@ globalThis.qwikOptimizer = function(module) {
       return value;
     }
     set(target, prop, value) {
-      target = unwrapDeserializerProxy(target);
       if ("symbol" === typeof prop) {
         target[prop] = value;
         return true;
@@ -3313,6 +3319,7 @@ globalThis.qwikOptimizer = function(module) {
     const effects = Object.prototype.hasOwnProperty.call(effectsMap, prop) && effectsMap[prop] || (effectsMap[prop] = []);
     ensureContainsEffect(effects, effectSubscriber);
     ensureContains(effectSubscriber, target);
+    ensureEffectContainsSubscriber(effectSubscriber[0], target, store.$container$);
     DEBUG && log("sub", pad("\n" + store.$effects$.toString(), "  "));
   }
   function setNewValueAndTriggerEffects(prop, value, target, currentStore) {
@@ -3342,26 +3349,33 @@ globalThis.qwikOptimizer = function(module) {
     }
     for (let i = effects.length - 1; i >= 0; i--) {
       const subscriber = effects[i];
-      const subscriptionRemoved = clearEffects(subscriber, value);
-      subscriptionRemoved && effects.splice(i, 1);
+      clearEffects(subscriber, value, effects, i, container);
     }
+    0 === effects.length && vnode_setProp(value, QSubscribers, null);
   }
-  function clearSubscriberEffectDependencies(value) {
+  function clearSubscriberEffectDependencies(container, value) {
     if (value.$effectDependencies$) {
       for (let i = value.$effectDependencies$.length - 1; i >= 0; i--) {
         const subscriber = value.$effectDependencies$[i];
-        const subscriptionRemoved = clearEffects(subscriber, value);
-        subscriptionRemoved && value.$effectDependencies$.splice(i, 1);
+        clearEffects(subscriber, value, value.$effectDependencies$, i, container);
       }
+      0 === value.$effectDependencies$.length && (value.$effectDependencies$ = null);
     }
   }
-  function clearEffects(subscriber, value) {
-    if (!isSignal(subscriber)) {
-      return false;
-    }
+  function clearEffects(subscriber, value, effectArray, indexToRemove, container) {
+    let subscriptionRemoved = false;
+    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);
+      const handler = getStoreHandler(store);
+      subscriptionRemoved = clearStoreEffects(handler, value);
+    }
+    subscriptionRemoved && effectArray.splice(indexToRemove, 1);
+  }
+  function clearSignalEffects(subscriber, value, seenSet) {
     const effectSubscriptions = subscriber.$effects$;
-    const hostElement = subscriber.$hostElement$;
-    hostElement && hostElement === value && (subscriber.$hostElement$ = null);
     let subscriptionRemoved = false;
     if (effectSubscriptions) {
       for (let i = effectSubscriptions.length - 1; i >= 0; i--) {
@@ -3372,14 +3386,69 @@ globalThis.qwikOptimizer = function(module) {
         }
       }
     }
-    const args = subscriber.$args$;
-    if (args) {
-      for (let i = args.length - 1; i >= 0; i--) {
-        clearEffects(args[i], subscriber);
+    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;
+  }
+  function clearStoreEffects(storeHandler, value) {
+    const effectSubscriptions = storeHandler.$effects$;
+    if (!effectSubscriptions) {
+      return false;
+    }
+    let subscriptionRemoved = false;
+    for (const key in effectSubscriptions) {
+      const effects = effectSubscriptions[key];
+      for (let i = effects.length - 1; i >= 0; i--) {
+        const effect = effects[i];
+        if (effect[0] === value) {
+          effects.splice(i, 1);
+          subscriptionRemoved = true;
+        }
       }
+      0 === effects.length && delete effectSubscriptions[key];
     }
     return subscriptionRemoved;
   }
+  function clearArgsEffects(args, subscriber, seenSet) {
+    for (let i = args.length - 1; i >= 0; i--) {
+      const arg = args[i];
+      clearArgEffect(arg, subscriber, seenSet);
+    }
+  }
+  function clearArgEffect(arg, subscriber, seenSet) {
+    if (seenSet.has(arg)) {
+      return;
+    }
+    seenSet.add(arg);
+    if (isSignal(arg)) {
+      clearSignalEffects(arg, subscriber, seenSet);
+    } else if ("object" === typeof arg && null !== arg) {
+      if (isStore(arg)) {
+        clearStoreEffects(getStoreHandler(arg), subscriber);
+      } else if (isPropsProxy(arg)) {
+        const constProps = arg[_CONST_PROPS];
+        const varProps = arg[_VAR_PROPS];
+        if (constProps) {
+          for (const key in constProps) {
+            clearArgEffect(constProps[key], subscriber, seenSet);
+          }
+        }
+        for (const key in varProps) {
+          clearArgEffect(varProps[key], subscriber, seenSet);
+        }
+      } else {
+        for (const key in arg) {
+          clearArgEffect(arg[key], subscriber, seenSet);
+        }
+      }
+    } else {
+      Array.isArray(arg) && clearArgsEffects(arg, subscriber, seenSet);
+    }
+  }
   var _createResourceReturn = opts => {
     const resource = {
       __brand: "resource",
@@ -3403,7 +3472,7 @@ globalThis.qwikOptimizer = function(module) {
     cleanupTask(task);
     const iCtx = newInvokeContext(container.$locale$, host, void 0, ResourceEvent);
     iCtx.$container$ = container;
-    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(task)));
+    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 track = (obj, prop) => {
@@ -3786,6 +3855,17 @@ globalThis.qwikOptimizer = function(module) {
     }
     return 0 === lastIdx ? html : escapedHTML + html.substring(lastIdx);
   }
+  function getFileLocationFromJsx(jsxDev) {
+    var _a;
+    if (!jsxDev) {
+      return null;
+    }
+    const sanitizedFileName = null == (_a = jsxDev.fileName) ? void 0 : _a.replace(/\\/g, "/");
+    if (sanitizedFileName) {
+      return `${sanitizedFileName}:${jsxDev.lineNumber}:${jsxDev.columnNumber}`;
+    }
+    return null;
+  }
   var vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
     let journal = container.$journal$;
     const stack2 = [];
@@ -4067,7 +4147,7 @@ globalThis.qwikOptimizer = function(module) {
         vnode_remove(journal, vParent, toRemove, true);
       }
     }
-    function createNewElement(jsx2, elementName) {
+    function createNewElement(jsx2, elementName, currentFile) {
       const element = createElementWithNamespace(elementName);
       const {constProps: constProps} = jsx2;
       let needsQDispatchEventPatch = false;
@@ -4091,6 +4171,7 @@ globalThis.qwikOptimizer = function(module) {
               value(element);
               continue;
             }
+            throw qError(32, [ currentFile ]);
           }
           if (isSignal(value)) {
             const signalData = new EffectPropData({
@@ -4105,13 +4186,13 @@ globalThis.qwikOptimizer = function(module) {
             continue;
           }
           if ("textarea" === elementName && "value" === key2) {
-            if ("string" !== typeof value) {
+            if (value && "string" !== typeof value) {
               if (isDev) {
-                throw qError(40);
+                throw qError(40, [ currentFile, value ]);
               }
               continue;
             }
-            element.value = escapeHTML(value);
+            element.value = escapeHTML(value || "");
             continue;
           }
           value = serializeAttribute(key2, value, scopedStyleIdPrefix);
@@ -4140,20 +4221,27 @@ globalThis.qwikOptimizer = function(module) {
       const isSameElementName = vCurrent && vnode_isElementVNode(vCurrent) && elementName === vnode_getElementName(vCurrent);
       const jsxKey = jsx2.key;
       let needsQDispatchEventPatch = false;
+      const currentFile = getFileLocationFromJsx(jsx2.dev);
       if (!isSameElementName || jsxKey !== getKey(vCurrent)) {
         vNewNode = retrieveChildWithKey(elementName, jsxKey);
-        null === vNewNode ? needsQDispatchEventPatch = createNewElement(jsx2, elementName) : vnode_insertBefore(journal, vParent, vNewNode, vCurrent);
+        if (null === vNewNode) {
+          needsQDispatchEventPatch = createNewElement(jsx2, elementName);
+        } else {
+          vnode_insertBefore(journal, vParent, vNewNode, vCurrent);
+          vCurrent = vNewNode;
+          vNewNode = null;
+          null !== vSiblings && (vSiblingsIdx -= 3);
+        }
       }
       const jsxAttrs = [];
       const props = jsx2.varProps;
       for (const key in props) {
-        let value = props[key];
-        value = serializeAttribute(key, value, scopedStyleIdPrefix);
+        const value = props[key];
         null != value && mapArray_set(jsxAttrs, key, value, 0);
       }
       null !== jsxKey && mapArray_set(jsxAttrs, ELEMENT_KEY, jsxKey, 0);
       const vNode = vNewNode || vCurrent;
-      needsQDispatchEventPatch = setBulkProps(vNode, jsxAttrs) || needsQDispatchEventPatch;
+      needsQDispatchEventPatch = setBulkProps(vNode, jsxAttrs, currentFile) || needsQDispatchEventPatch;
       if (needsQDispatchEventPatch) {
         const element = vnode_getNode(vNode);
         element.qDispatchEvent || (element.qDispatchEvent = (event, scope) => {
@@ -4171,7 +4259,7 @@ globalThis.qwikOptimizer = function(module) {
         });
       }
     }
-    function setBulkProps(vnode, srcAttrs) {
+    function setBulkProps(vnode, srcAttrs, currentFile) {
       vnode_ensureElementInflated(vnode);
       const dstAttrs = vnode;
       let srcIdx = 0;
@@ -4196,9 +4284,16 @@ globalThis.qwikOptimizer = function(module) {
             value(element);
             return;
           }
+          throw qError(32, [ currentFile ]);
+        }
+        if (isSignal(value)) {
+          const signalData = new EffectPropData({
+            $scopedStyleIdPrefix$: scopedStyleIdPrefix,
+            $isConst$: false
+          });
+          value = trackSignalAndAssignHost(value, vnode, key, container, signalData);
         }
-        isSignal(value) && (value = untrack((() => value.value)));
-        vnode_setAttr(journal, vnode, key, value);
+        vnode_setAttr(journal, vnode, key, serializeAttribute(key, value, scopedStyleIdPrefix));
         null === value && (dstLength = dstAttrs.length);
       };
       const recordJsxEvent = (key, value) => {
@@ -4234,6 +4329,8 @@ globalThis.qwikOptimizer = function(module) {
           }
           srcIdx++;
           srcKey = srcIdx < srcLength ? srcAttrs[srcIdx++] : null;
+          dstIdx++;
+          dstKey = dstIdx < dstLength ? dstAttrs[dstIdx++] : null;
         } else if (srcKey == dstKey) {
           const srcValue = srcAttrs[srcIdx++];
           const dstValue = dstAttrs[dstIdx++];
@@ -4300,7 +4397,7 @@ globalThis.qwikOptimizer = function(module) {
       if (null !== jsxKey) {
         vNewNode = retrieveChildWithKey(null, jsxKey);
         if (null != vNewNode) {
-          vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore());
+          vnode_insertBefore(journal, vParent, vNewNode, vCurrent && getInsertBefore());
           return;
         }
       }
@@ -4455,7 +4552,7 @@ globalThis.qwikOptimizer = function(module) {
               const obj = seq[i];
               if (isTask(obj)) {
                 const task = obj;
-                clearSubscriberEffectDependencies(task);
+                clearSubscriberEffectDependencies(container, task);
                 1 & task.$flags$ ? container.$scheduler$(48, task) : cleanupTask(task);
               }
             }
@@ -4535,6 +4632,77 @@ globalThis.qwikOptimizer = function(module) {
   }
   var HANDLER_PREFIX = ":";
   var count = 0;
+  var aVNodePath = [];
+  var bVNodePath = [];
+  var vnode_documentPosition = (a, b, rootVNode) => {
+    if (a === b) {
+      return 0;
+    }
+    let aDepth = -1;
+    let bDepth = -1;
+    while (a) {
+      const vNode = aVNodePath[++aDepth] = a;
+      a = vNode[1] || rootVNode && vnode_getProp(a, QSlotParent, (id => vnode_locate(rootVNode, id)));
+    }
+    while (b) {
+      const vNode = bVNodePath[++bDepth] = b;
+      b = vNode[1] || rootVNode && vnode_getProp(b, QSlotParent, (id => vnode_locate(rootVNode, id)));
+    }
+    while (aDepth >= 0 && bDepth >= 0) {
+      a = aVNodePath[aDepth];
+      b = bVNodePath[bDepth];
+      if (a !== b) {
+        let cursor = b;
+        do {
+          cursor = vnode_getNextSibling(cursor);
+          if (cursor === a) {
+            return 1;
+          }
+        } while (cursor);
+        cursor = b;
+        do {
+          cursor = vnode_getPreviousSibling(cursor);
+          if (cursor === a) {
+            return -1;
+          }
+        } while (cursor);
+        if (rootVNode && vnode_getProp(b, QSlotParent, (id => vnode_locate(rootVNode, id)))) {
+          return -1;
+        }
+        return 1;
+      }
+      aDepth--;
+      bDepth--;
+    }
+    return aDepth < bDepth ? -1 : 1;
+  };
+  var aSsrNodePath = [];
+  var bSsrNodePath = [];
+  var ssrNodeDocumentPosition = (a, b) => {
+    if (a === b) {
+      return 0;
+    }
+    let aDepth = -1;
+    let bDepth = -1;
+    while (a) {
+      const ssrNode = aSsrNodePath[++aDepth] = a;
+      a = ssrNode.currentComponentNode;
+    }
+    while (b) {
+      const ssrNode = bSsrNodePath[++bDepth] = b;
+      b = ssrNode.currentComponentNode;
+    }
+    while (aDepth >= 0 && bDepth >= 0) {
+      a = aSsrNodePath[aDepth];
+      b = bSsrNodePath[bDepth];
+      if (a !== b) {
+        return 1;
+      }
+      aDepth--;
+      bDepth--;
+    }
+    return aDepth < bDepth ? -1 : 1;
+  };
   var DEBUG2 = false;
   var createScheduler = (container, scheduleDrain, journalFlush) => {
     const choreQueue = [];
@@ -4558,15 +4726,15 @@ globalThis.qwikOptimizer = function(module) {
       };
       chore.$promise$ = new Promise((resolve => chore.$resolve$ = resolve));
       DEBUG2 && debugTrace("schedule", chore, currentChore, choreQueue);
-      chore = sortedInsert(choreQueue, chore);
+      chore = sortedInsert(choreQueue, chore, container.rootVNode || null);
       if (!journalFlushScheduled && runLater) {
         journalFlushScheduled = true;
         schedule(16);
         scheduleDrain();
       }
-      return runLater ? chore.$promise$ : drainUpTo(chore);
+      return runLater ? chore.$promise$ : drainUpTo(chore, container.rootVNode || null);
     }
-    function drainUpTo(runUptoChore) {
+    function drainUpTo(runUptoChore, rootVNode) {
       if (runUptoChore.$executed$) {
         return runUptoChore.$returnValue$;
       }
@@ -4575,7 +4743,7 @@ globalThis.qwikOptimizer = function(module) {
       }
       while (choreQueue.length) {
         const nextChore = choreQueue.shift();
-        const order = choreComparator(nextChore, runUptoChore, false);
+        const order = choreComparator(nextChore, runUptoChore, rootVNode);
         if (null === order) {
           continue;
         }
@@ -4589,7 +4757,7 @@ globalThis.qwikOptimizer = function(module) {
         }
         const returnValue = executeChore(nextChore);
         if (isPromise(returnValue)) {
-          const promise = returnValue.then((() => drainUpTo(runUptoChore)));
+          const promise = returnValue.then((() => drainUpTo(runUptoChore, rootVNode)));
           return promise;
         }
       }
@@ -4613,7 +4781,7 @@ globalThis.qwikOptimizer = function(module) {
         returnValue = safeCall((() => executeComponent(container, host, host, chore.$target$, chore.$payload$)), (jsx3 => {
           if (7 === chore.$type$) {
             const styleScopedId = container.getHostProp(host, QScopedStyle);
-            return vnode_diff(container, jsx3, host, addComponentStylePrefix(styleScopedId));
+            return retryOnPromise((() => vnode_diff(container, jsx3, host, addComponentStylePrefix(styleScopedId))));
           }
           return jsx3;
         }), (err => container.handleError(err, host)));
@@ -4641,7 +4809,7 @@ globalThis.qwikOptimizer = function(module) {
         const parentVirtualNode = chore.$target$;
         let jsx2 = chore.$payload$;
         isSignal(jsx2) && (jsx2 = jsx2.value);
-        returnValue = vnode_diff(container, jsx2, parentVirtualNode, null);
+        returnValue = retryOnPromise((() => vnode_diff(container, jsx2, parentVirtualNode, null)));
         break;
 
        case 5:
@@ -4701,7 +4869,7 @@ globalThis.qwikOptimizer = function(module) {
   function vNodeAlreadyDeleted(chore) {
     return !!(chore.$host$ && vnode_isVNode(chore.$host$) && 32 & chore.$host$[0]);
   }
-  function choreComparator(a, b, shouldThrowOnHostMismatch) {
+  function choreComparator(a, b, rootVNode) {
     const macroTypeDiff = (240 & a.$type$) - (240 & b.$type$);
     if (0 !== macroTypeDiff) {
       return macroTypeDiff;
@@ -4710,16 +4878,15 @@ globalThis.qwikOptimizer = function(module) {
       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(45, [ errorMessage ]);
+        if (vnode_isVNode(aHost) && vnode_isVNode(bHost)) {
+          const hostDiff = vnode_documentPosition(aHost, bHost, rootVNode);
+          if (0 !== hostDiff) {
+            return hostDiff;
           }
+        } else {
+          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);
-          return null;
-        }
-        {
-          const hostDiff = vnode_documentPosition(aHost, bHost);
+          const hostDiff = ssrNodeDocumentPosition(aHost, bHost);
           if (0 !== hostDiff) {
             return hostDiff;
           }
@@ -4739,13 +4906,13 @@ globalThis.qwikOptimizer = function(module) {
     }
     return 0;
   }
-  function sortedFindIndex(sortedArray, value) {
+  function sortedFindIndex(sortedArray, value, rootVNode) {
     let bottom = 0;
     let top = sortedArray.length;
     while (bottom < top) {
       const middle = bottom + (top - bottom >> 1);
       const midChore = sortedArray[middle];
-      const comp = choreComparator(value, midChore, true);
+      const comp = choreComparator(value, midChore, rootVNode);
       if (comp < 0) {
         top = middle;
       } else {
@@ -4757,8 +4924,8 @@ globalThis.qwikOptimizer = function(module) {
     }
     return ~bottom;
   }
-  function sortedInsert(sortedArray, value) {
-    const idx = sortedFindIndex(sortedArray, value);
+  function sortedInsert(sortedArray, value, rootVNode) {
+    const idx = sortedFindIndex(sortedArray, value, rootVNode);
     if (idx < 0) {
       sortedArray.splice(~idx, 0, value);
       return value;
@@ -4801,7 +4968,7 @@ globalThis.qwikOptimizer = function(module) {
     cleanupTask(task);
     const iCtx = newInvokeContext(container.$locale$, host, void 0, TaskEvent);
     iCtx.$container$ = container;
-    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(task)));
+    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(container, task)));
     const track = (obj, prop) => {
       const ctx = newInvokeContext();
       ctx.$effectSubscriber$ = [ task, ":" ];
@@ -4925,7 +5092,7 @@ globalThis.qwikOptimizer = function(module) {
     }
     valueOf() {
       if (qDev) {
-        throw qError(46);
+        throw qError(45);
       }
     }
     toString() {
@@ -5064,7 +5231,7 @@ globalThis.qwikOptimizer = function(module) {
       try {
         const untrackedValue = computeQrl.getFn(ctx)();
         if (isPromise(untrackedValue)) {
-          throw qError(47, [ computeQrl.dev ? computeQrl.dev.file : "", computeQrl.$hash$ ]);
+          throw qError(46, [ computeQrl.dev ? computeQrl.dev.file : "", computeQrl.$hash$ ]);
         }
         DEBUG3 && log2("Signal.$compute$", untrackedValue);
         this.$invalid$ = false;
@@ -5079,7 +5246,7 @@ globalThis.qwikOptimizer = function(module) {
       return super.value;
     }
     set value(_) {
-      throw qError(48);
+      throw qError(47);
     }
   };
   var WrappedSignal = class extends Signal {
@@ -5126,10 +5293,10 @@ globalThis.qwikOptimizer = function(module) {
       return super.value;
     }
     set value(_) {
-      throw qError(49);
+      throw qError(48);
     }
   };
-  var version = "2.0.0-alpha.4-dev+374e0d6";
+  var version = "2.0.0-alpha.6-dev+d848ba5";
   var _SharedContainer = class {
     $version$;
     $scheduler$;
@@ -6248,7 +6415,7 @@ globalThis.qwikOptimizer = function(module) {
     assertTrue(vnode_isTextVNode(vnode), "Expecting Text Node.");
     return vnode[4];
   };
-  function vnode_toString(depth = 10, offset = "", materialize2 = false, siblings = false) {
+  function vnode_toString(depth = 20, offset = "", materialize2 = false, siblings = false) {
     var _a;
     let vnode = this;
     if (0 === depth) {
@@ -6429,51 +6596,11 @@ globalThis.qwikOptimizer = function(module) {
     throw qError(43, [ type ]);
   };
   var isElement = node => node && "object" == typeof node && 1 === fastNodeType(node);
-  var aPath = [];
-  var bPath = [];
-  var vnode_documentPosition = (a, b) => {
-    if (a === b) {
-      return 0;
-    }
-    let aDepth = -1;
-    let bDepth = -1;
-    while (a) {
-      a = (aPath[++aDepth] = a)[1];
-    }
-    while (b) {
-      b = (bPath[++bDepth] = b)[1];
-    }
-    while (aDepth >= 0 && bDepth >= 0) {
-      a = aPath[aDepth];
-      b = bPath[bDepth];
-      if (a !== b) {
-        let cursor = b;
-        do {
-          cursor = vnode_getNextSibling(cursor);
-          if (cursor === a) {
-            return 1;
-          }
-        } while (cursor);
-        cursor = b;
-        do {
-          cursor = vnode_getPreviousSibling(cursor);
-          if (cursor === a) {
-            return -1;
-          }
-        } while (cursor);
-        return 1;
-      }
-      aDepth--;
-      bDepth--;
-    }
-    return aDepth < bDepth ? -1 : 1;
-  };
   var vnode_getProjectionParentComponent = (vHost, rootVNode) => {
     let projectionDepth = 1;
     while (projectionDepth--) {
       while (vHost && (!vnode_isVirtualVNode(vHost) || null === vnode_getProp(vHost, OnRenderProp, null))) {
-        const qSlotParentProp = vnode_getProp(vHost, QSlotParent, null);
-        const qSlotParent = qSlotParentProp && ("string" === typeof qSlotParentProp ? vnode_locate(rootVNode, qSlotParentProp) : qSlotParentProp);
+        const qSlotParent = vnode_getProp(vHost, QSlotParent, (id => vnode_locate(rootVNode, id)));
         const vProjectionParent = vnode_isVirtualVNode(vHost) && qSlotParent;
         vProjectionParent && projectionDepth++;
         vHost = vProjectionParent || vnode_getParent(vHost);
@@ -6934,13 +7061,10 @@ globalThis.qwikOptimizer = function(module) {
           if (null !== vnode_getProp(vNode, OnRenderProp, null)) {
             return vNode;
           }
-          const parent = vnode_getProp(vNode, QSlotParent, this.$vnodeLocate$);
-          if (parent) {
-            vNode = parent;
-            continue;
-          }
+          vNode = vnode_getParent(vNode) || vnode_getProp(vNode, QSlotParent, this.$vnodeLocate$);
+        } else {
+          vNode = vnode_getParent(vNode);
         }
-        vNode = vnode_getParent(vNode);
       }
       return null;
     }
@@ -7035,10 +7159,6 @@ globalThis.qwikOptimizer = function(module) {
     }
   };
   var deserializedProxyMap = new WeakMap;
-  var unwrapDeserializerProxy = value => {
-    const unwrapped = "object" === typeof value && null !== value && value[SERIALIZER_PROXY_UNWRAP];
-    return unwrapped || value;
-  };
   var isDeserializerProxy = value => "object" === typeof value && null !== value && SERIALIZER_PROXY_UNWRAP in value;
   var SERIALIZER_PROXY_UNWRAP = Symbol("UNWRAP");
   var wrapDeserializerProxy = (container, data) => {
@@ -7076,11 +7196,11 @@ globalThis.qwikOptimizer = function(module) {
         return value;
       }
       const container = this.$container$;
-      const propValue = allocate(container, typeId, value);
+      let propValue = allocate(container, typeId, value);
+      typeId >= 12 && (propValue = inflate(container, propValue, typeId, value));
       Reflect.set(target, property, propValue);
       this.$data$[idx] = void 0;
       this.$data$[idx + 1] = propValue;
-      typeId >= 12 && inflate(container, propValue, typeId, value);
       return propValue;
     }
     has(target, property) {
@@ -7115,7 +7235,7 @@ globalThis.qwikOptimizer = function(module) {
   var inflate = (container, target, typeId, data) => {
     var _a;
     if (void 0 === typeId) {
-      return;
+      return target;
     }
     13 !== typeId && Array.isArray(data) && (data = _eagerDeserializeArray(container, data));
     switch (typeId) {
@@ -7182,12 +7302,11 @@ globalThis.qwikOptimizer = function(module) {
      case 26:
       {
         const [value, flags, effects2, storeEffect] = data;
-        const handler = getStoreHandler(target);
-        handler.$flags$ = flags;
-        Object.assign(getStoreTarget(target), value);
+        const store = getOrCreateStore(value, flags, container);
+        const storeHandler = getStoreHandler(store);
         storeEffect && (effects2[STORE_ARRAY_PROP] = storeEffect);
-        handler.$effects$ = effects2;
-        container.$storeProxyMap$.set(value, target);
+        storeHandler.$effects$ = effects2;
+        target = store;
         break;
       }
 
@@ -7323,6 +7442,7 @@ globalThis.qwikOptimizer = function(module) {
      default:
       throw qError(33, [ typeId ]);
     }
+    return target;
   };
   var _constants = [ void 0, null, true, false, "", 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 ];
   var allocate = (container, typeId, value) => {
@@ -7385,10 +7505,8 @@ globalThis.qwikOptimizer = function(module) {
       return new ComputedSignal(container, null);
 
      case 25:
-      return createStore(container, {}, 0);
-
      case 26:
-      return createStore(container, [], 0);
+      return null;
 
      case 11:
       return new URLSearchParams(value);
@@ -7946,13 +8064,13 @@ globalThis.qwikOptimizer = function(module) {
     }
     return qrlStringInline;
   }
-  function deserializeData(container, typeId, propValue) {
+  function deserializeData(container, typeId, value) {
     if (void 0 === typeId) {
-      return propValue;
+      return value;
     }
-    const value = allocate(container, typeId, propValue);
-    typeId >= 12 && inflate(container, value, typeId, propValue);
-    return value;
+    let propValue = allocate(container, typeId, value);
+    typeId >= 12 && (propValue = inflate(container, propValue, typeId, value));
+    return propValue;
   }
   function shouldTrackObj(obj) {
     return "object" === typeof obj && null !== obj || "string" === typeof obj && obj.length > 1;
@@ -8417,8 +8535,7 @@ globalThis.qwikOptimizer = function(module) {
       return next(err);
     }));
     setTimeout((() => {
-      console.log(`\n  ❗️ ${magenta("Expect significant performance loss in development.")}`);
-      console.log(`  ❗️ ${magenta("Disabling the browser's cache results in waterfall requests.")}`);
+      console.log(`\n  🚧 ${magenta("Please note that development mode is slower than production.")}`);
     }), 1e3);
   }
   async function configurePreviewServer(middlewares, ssrOutDir, sys, path) {