feat: MPA fallback for when SPA Link navigation is too slow

packages/docs/src/routes/api/qwik-city/api.json

@@ -404,7 +404,7 @@
         }
       ],
       "kind": "Interface",
-      "content": "```typescript\nexport interface LinkProps extends AnchorAttributes \n```\n**Extends:** AnchorAttributes\n\n\n<table><thead><tr><th>\n\nProperty\n\n\n</th><th>\n\nModifiers\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\n[prefetch?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean \\| 'js'\n\n\n</td><td>\n\n_(Optional)_ \\*\\*Defaults to \\_true\\_.\\*\\*\n\nWhether Qwik should prefetch and cache the target page of this \\*\\*`Link`<!-- -->\\*\\*, this includes invoking any \\*\\*`routeLoader$`<!-- -->\\*\\*, \\*\\*`onGet`<!-- -->\\*\\*, etc.\n\nThis \\*\\*improves UX performance\\*\\* for client-side (\\*\\*SPA\\*\\*) navigations.\n\nPrefetching occurs when a the Link enters the viewport in production (\\*\\*`on:qvisible`<!-- -->\\*\\*), or with \\*\\*`mouseover`<!-- -->/`focus`<!-- -->\\*\\* during dev.\n\nPrefetching will not occur if the user has the \\*\\*data saver\\*\\* setting enabled.\n\nSetting this value to \\*\\*`\"js\"`<!-- -->\\*\\* will prefetch only javascript bundles required to render this page on the client, \\*\\*`false`<!-- -->\\*\\* will disable prefetching altogether.\n\n\n</td></tr>\n<tr><td>\n\n[reload?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[replaceState?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[scroll?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n</tbody></table>",
+      "content": "```typescript\nexport interface LinkProps extends AnchorAttributes \n```\n**Extends:** AnchorAttributes\n\n\n<table><thead><tr><th>\n\nProperty\n\n\n</th><th>\n\nModifiers\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\n[fallbackToMpa?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_ \\*\\*Defaults to \\_true\\_.\\*\\*\n\nWhether Qwik should fallback to MPA navigation if too many bundles are queued for preloading.\n\n\n</td></tr>\n<tr><td>\n\n[prefetch?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean \\| 'js'\n\n\n</td><td>\n\n_(Optional)_ \\*\\*Defaults to \\_true\\_.\\*\\*\n\nWhether Qwik should prefetch and cache the target page of this \\*\\*`Link`<!-- -->\\*\\*, this includes invoking any \\*\\*`routeLoader$`<!-- -->\\*\\*, \\*\\*`onGet`<!-- -->\\*\\*, etc.\n\nThis \\*\\*improves UX performance\\*\\* for client-side (\\*\\*SPA\\*\\*) navigations.\n\nPrefetching occurs when a the Link enters the viewport in production (\\*\\*`on:qvisible`<!-- -->\\*\\*), or with \\*\\*`mouseover`<!-- -->/`focus`<!-- -->\\*\\* during dev.\n\nPrefetching will not occur if the user has the \\*\\*data saver\\*\\* setting enabled.\n\nSetting this value to \\*\\*`\"js\"`<!-- -->\\*\\* will prefetch only javascript bundles required to render this page on the client, \\*\\*`false`<!-- -->\\*\\* will disable prefetching altogether.\n\n\n</td></tr>\n<tr><td>\n\n[reload?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[replaceState?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[scroll?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n</tbody></table>",
       "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik-city/src/runtime/src/link-component.tsx",
       "mdFile": "qwik-city.linkprops.md"
     },
@@ -530,7 +530,7 @@
         }
       ],
       "kind": "Interface",
-      "content": "```typescript\nexport interface QwikCityMockProps \n```\n\n\n<table><thead><tr><th>\n\nProperty\n\n\n</th><th>\n\nModifiers\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\n[goto?](#)\n\n\n</td><td>\n\n\n</td><td>\n\n[RouteNavigate](#routenavigate)\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[params?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nRecord&lt;string, string&gt;\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[url?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nstring\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n</tbody></table>",
+      "content": "```typescript\nexport interface QwikCityMockProps \n```\n\n\n<table><thead><tr><th>\n\nProperty\n\n\n</th><th>\n\nModifiers\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\n[fallbackToMpa?](#)\n\n\n</td><td>\n\n\n</td><td>\n\n{ default: boolean; }\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[goto?](#)\n\n\n</td><td>\n\n\n</td><td>\n\n[RouteNavigate](#routenavigate)\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[params?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nRecord&lt;string, string&gt;\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n<tr><td>\n\n[url?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nstring\n\n\n</td><td>\n\n_(Optional)_\n\n\n</td></tr>\n</tbody></table>",
       "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik-city/src/runtime/src/qwik-city-component.tsx",
       "mdFile": "qwik-city.qwikcitymockprops.md"
     },
@@ -572,7 +572,7 @@
         }
       ],
       "kind": "Interface",
-      "content": "```typescript\nexport interface QwikCityProps \n```\n\n\n<table><thead><tr><th>\n\nProperty\n\n\n</th><th>\n\nModifiers\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\n[viewTransition?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_ Enable the ViewTransition API\n\nDefault: `true`\n\n\n</td></tr>\n</tbody></table>",
+      "content": "```typescript\nexport interface QwikCityProps \n```\n\n\n<table><thead><tr><th>\n\nProperty\n\n\n</th><th>\n\nModifiers\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\n[fallbackToMpa?](#)\n\n\n</td><td>\n\n\n</td><td>\n\n{ default: boolean; }\n\n\n</td><td>\n\n_(Optional)_ Whether Qwik should fallback to MPA navigation if too many bundles are queued for preloading during SPA navigation.\n\n\n</td></tr>\n<tr><td>\n\n[viewTransition?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_ Enable the ViewTransition API\n\nDefault: `true`\n\n\n</td></tr>\n</tbody></table>",
       "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik-city/src/runtime/src/qwik-city-component.tsx",
       "mdFile": "qwik-city.qwikcityprops.md"
     },

packages/docs/src/routes/api/qwik-city/index.mdx

@@ -1506,6 +1506,23 @@ Description
 </th></tr></thead>
 <tbody><tr><td>
 
+[fallbackToMpa?](#)
+
+</td><td>
+
+</td><td>
+
+boolean
+
+</td><td>
+
+_(Optional)_ \*\*Defaults to \_true\_.\*\*
+
+Whether Qwik should fallback to MPA navigation if too many bundles are queued for preloading.
+
+</td></tr>
+<tr><td>
+
 [prefetch?](#)
 
 </td><td>
@@ -1764,6 +1781,21 @@ Description
 </th></tr></thead>
 <tbody><tr><td>
 
+[fallbackToMpa?](#)
+
+</td><td>
+
+</td><td>
+
+\{ default: boolean; }
+
+</td><td>
+
+_(Optional)_
+
+</td></tr>
+<tr><td>
+
 [goto?](#)
 
 </td><td>
@@ -1971,6 +2003,21 @@ Description
 </th></tr></thead>
 <tbody><tr><td>
 
+[fallbackToMpa?](#)
+
+</td><td>
+
+</td><td>
+
+\{ default: boolean; }
+
+</td><td>
+
+_(Optional)_ Whether Qwik should fallback to MPA navigation if too many bundles are queued for preloading during SPA navigation.
+
+</td></tr>
+<tr><td>
+
 [viewTransition?](#)
 
 </td><td>

packages/docs/src/routes/api/qwik-optimizer/api.json

@@ -106,6 +106,23 @@
       "content": "```typescript\ndirname(path: string): string;\n```\n\n\n<table><thead><tr><th>\n\nParameter\n\n\n</th><th>\n\nType\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\npath\n\n\n</td><td>\n\nstring\n\n\n</td><td>\n\n\n</td></tr>\n</tbody></table>\n\n**Returns:**\n\nstring",
       "mdFile": "qwik.path.dirname.md"
     },
+    {
+      "name": "enableFallbackToMpa",
+      "id": "experimentalfeatures-enablefallbacktompa",
+      "hierarchy": [
+        {
+          "name": "ExperimentalFeatures",
+          "id": "experimentalfeatures-enablefallbacktompa"
+        },
+        {
+          "name": "enableFallbackToMpa",
+          "id": "experimentalfeatures-enablefallbacktompa"
+        }
+      ],
+      "kind": "EnumMember",
+      "content": "",
+      "mdFile": "qwik.experimentalfeatures.enablefallbacktompa.md"
+    },
     {
       "name": "enableRequestRewrite",
       "id": "experimentalfeatures-enablerequestrewrite",
@@ -147,7 +164,7 @@
         }
       ],
       "kind": "Enum",
-      "content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\nUse `__EXPERIMENTAL__.x` to check if feature `x` is enabled. It will be replaced with `true` or `false` via an exact string replacement.\n\nAdd experimental features to this enum definition.\n\n\n```typescript\nexport declare enum ExperimentalFeatures \n```\n\n\n<table><thead><tr><th>\n\nMember\n\n\n</th><th>\n\nValue\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\nenableRequestRewrite\n\n\n</td><td>\n\n`\"enableRequestRewrite\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable request.rewrite()\n\n\n</td></tr>\n<tr><td>\n\nnoSPA\n\n\n</td><td>\n\n`\"noSPA\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Disable SPA navigation handler in Qwik City\n\n\n</td></tr>\n<tr><td>\n\npreventNavigate\n\n\n</td><td>\n\n`\"preventNavigate\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable the usePreventNavigate hook\n\n\n</td></tr>\n<tr><td>\n\nvalibot\n\n\n</td><td>\n\n`\"valibot\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable the Valibot form validation\n\n\n</td></tr>\n</tbody></table>",
+      "content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\nUse `__EXPERIMENTAL__.x` to check if feature `x` is enabled. It will be replaced with `true` or `false` via an exact string replacement.\n\nAdd experimental features to this enum definition.\n\n\n```typescript\nexport declare enum ExperimentalFeatures \n```\n\n\n<table><thead><tr><th>\n\nMember\n\n\n</th><th>\n\nValue\n\n\n</th><th>\n\nDescription\n\n\n</th></tr></thead>\n<tbody><tr><td>\n\nenableFallbackToMpa\n\n\n</td><td>\n\n`\"enableFallbackToMpa\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable falling back to MPA when SPA navigation is slow, which can happen with a big page during preloading\n\n\n</td></tr>\n<tr><td>\n\nenableRequestRewrite\n\n\n</td><td>\n\n`\"enableRequestRewrite\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable request.rewrite()\n\n\n</td></tr>\n<tr><td>\n\nnoSPA\n\n\n</td><td>\n\n`\"noSPA\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Disable SPA navigation handler in Qwik City\n\n\n</td></tr>\n<tr><td>\n\npreventNavigate\n\n\n</td><td>\n\n`\"preventNavigate\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable the usePreventNavigate hook\n\n\n</td></tr>\n<tr><td>\n\nvalibot\n\n\n</td><td>\n\n`\"valibot\"`\n\n\n</td><td>\n\n**_(ALPHA)_** Enable the Valibot form validation\n\n\n</td></tr>\n</tbody></table>",
       "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik/src/optimizer/src/plugins/plugin.ts",
       "mdFile": "qwik.experimentalfeatures.md"
     },

packages/docs/src/routes/api/qwik-optimizer/index.mdx

@@ -328,6 +328,8 @@ string
 
 string
 
+## enableFallbackToMpa
+
 ## enableRequestRewrite
 
 ## EntryStrategy
@@ -374,6 +376,19 @@ Description
 </th></tr></thead>
 <tbody><tr><td>
 
+enableFallbackToMpa
+
+</td><td>
+
+`"enableFallbackToMpa"`
+
+</td><td>
+
+**_(ALPHA)_** Enable falling back to MPA when SPA navigation is slow, which can happen with a big page during preloading
+
+</td></tr>
+<tr><td>
+
 enableRequestRewrite
 
 </td><td>

packages/qwik-city/src/runtime/src/contexts.ts

@@ -29,3 +29,5 @@ export const RouteInternalContext =
 
 export const RoutePreventNavigateContext =
   /*#__PURE__*/ createContextId<RoutePreventNavigate>('qc-p');
+
+export const fallbackToMpaContext = /*#__PURE__*/ createContextId<{ default: boolean }>('qc-f');

packages/qwik-city/src/runtime/src/link-component.tsx

@@ -17,21 +17,31 @@ import { preloadRouteBundles } from './client-navigate';
 import { isDev } from '@builder.io/qwik';
 // @ts-expect-error we don't have types for the preloader yet
 import { p as preload } from '@builder.io/qwik/preloader';
+// import { fallbackToMpaContext } from './contexts';
 
 /** @public */
 export const Link = component$<LinkProps>((props) => {
   const nav = useNavigate();
   const loc = useLocation();
   const originalHref = props.href;
   const anchorRef = useSignal<HTMLAnchorElement>();
+
   const {
     onClick$,
     prefetch: prefetchProp,
     reload,
     replaceState,
     scroll,
+    fallbackToMpa: fallbackToMpaProp,
     ...linkProps
   } = (() => props)();
+
+  // const defaultFallbackToMpa = useContext(fallbackToMpaContext).default;
+
+  // const fallbackToMpa = __EXPERIMENTAL__.enableFallbackToMpa
+  //   ? untrack(() => Boolean(fallbackToMpaProp ?? defaultFallbackToMpa))
+  //   : undefined;
+
   const clientNavPath = untrack(() => getClientNavPath({ ...linkProps, reload }, loc));
   linkProps.href = clientNavPath || originalHref;
 
@@ -66,7 +76,7 @@ export const Link = component$<LinkProps>((props) => {
     : undefined;
 
   const preventDefault = clientNavPath
-    ? sync$((event: MouseEvent, target: HTMLAnchorElement) => {
+    ? sync$((event: MouseEvent) => {
         if (!(event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)) {
           event.preventDefault();
         }
@@ -89,9 +99,27 @@ export const Link = component$<LinkProps>((props) => {
       })
     : undefined;
 
-  const handlePreload = $((_: any, elm: HTMLAnchorElement) => {
-    const url = new URL(elm.href);
+  const handlePreload = $((_: any, target: HTMLAnchorElement) => {
+    if (!target?.href) {
+      return;
+    }
+    const onTooMany = (event: Event) => {
+      const userEventPreloads = (event as CustomEvent).detail;
+      /**
+       * On chrome 3G throttling, 10kb takes ~1s to download. Bundles weight ~1kb on average, so 100
+       * bundles is ~100kb which takes ~10s to download.
+       *
+       * This can serve to fallback to MPA when SPA navigation takes more than 10s. Or in extreme
+       * cases, if a component needs more than a 100 bundles, display a spinner.
+       */
+      if (userEventPreloads.count >= 100) {
+        location.assign(target.href);
+      }
+    };
+    window.addEventListener('userEventPreloads', onTooMany);
+    const url = new URL(target.href);
     preloadRouteBundles(url.pathname, 1);
+    window.removeEventListener('userEventPreloads', onTooMany);
   });
 
   useVisibleTask$(({ track }) => {
@@ -166,4 +194,11 @@ export interface LinkProps extends AnchorAttributes {
   reload?: boolean;
   replaceState?: boolean;
   scroll?: boolean;
+
+  /**
+   * **Defaults to _true_.**
+   *
+   * Whether Qwik should fallback to MPA navigation if too many bundles are queued for preloading.
+   */
+  fallbackToMpa?: boolean;
 }

packages/qwik-city/src/runtime/src/qwik-city-component.tsx

@@ -24,6 +24,7 @@
   DocumentHeadContext,
   RouteActionContext,
   RouteInternalContext,
+  fallbackToMpaContext,
   RouteLocationContext,
   RouteNavigateContext,
   RoutePreventNavigateContext,
@@ -89,6 +90,12 @@
    * @see https://caniuse.com/mdn-api_viewtransition
    */
   viewTransition?: boolean;
+
+  /**
+   * Whether Qwik should fallback to MPA navigation if too many bundles are queued for preloading
+   * during SPA navigation.
+   */
+  fallbackToMpa?: { default: boolean };
 }
 
 // Gets populated by registerPreventNav on the client
@@ -307,6 +314,7 @@
   useContextProvider(RouteActionContext, actionState);
   useContextProvider(RouteInternalContext, routeInternal);
   useContextProvider<any>(RoutePreventNavigateContext, registerPreventNav);
+  useContextProvider(fallbackToMpaContext, props.fallbackToMpa ?? { default: false });
 
   useTask$(({ track }) => {
     async function run() {
@@ -646,6 +654,7 @@
   url?: string;
   params?: Record<string, string>;
   goto?: RouteNavigate;
+  fallbackToMpa?: { default: boolean };
 }
 
 /** @public */
@@ -693,6 +702,8 @@
   useContextProvider(RouteStateContext, loaderState);
   useContextProvider(RouteActionContext, actionState);
   useContextProvider(RouteInternalContext, routeInternal);
+  console.log('props.fallbackToMpa', props.fallbackToMpa?.default);
+  useContextProvider(fallbackToMpaContext, props.fallbackToMpa ?? { default: false });
 
   return <Slot />;
 });

packages/qwik-city/src/runtime/src/qwik-city.runtime.api.md

@@ -277,6 +277,7 @@ export const Link: Component<LinkProps>;
 //
 // @public (undocumented)
 export interface LinkProps extends AnchorAttributes {
+    fallbackToMpa?: boolean;
     prefetch?: boolean | 'js';
     // (undocumented)
     reload?: boolean;
@@ -330,6 +331,10 @@ export const QWIK_CITY_SCROLLER = "_qCityScroller";
 
 // @public (undocumented)
 export interface QwikCityMockProps {
+    // (undocumented)
+    fallbackToMpa?: {
+        default: boolean;
+    };
     // (undocumented)
     goto?: RouteNavigate;
     // (undocumented)
@@ -359,6 +364,9 @@ export interface QwikCityPlan {
 
 // @public (undocumented)
 export interface QwikCityProps {
+    fallbackToMpa?: {
+        default: boolean;
+    };
     viewTransition?: boolean;
 }
 

packages/qwik/src/core/preloader/preloader.unit.ts

@@ -21,5 +21,5 @@
    * dereference objects etc, but that actually results in worse compression
    */
   const compressed = compress(Buffer.from(preLoader), { mode: 1, quality: 11 });
-  expect([compressed.length, preLoader.length]).toEqual([1818, 5417]);
+  expect([compressed.length, preLoader.length]).toEqual([2031, 6129]);
 });

packages/qwik/src/core/preloader/queue.ts

@@ -74,6 +74,11 @@ export const trigger = () => {
   }
   sortQueue();
   while (queue.length) {
+    const userEventPreloads = queue.filter((item) => item.$inverseProbability$ <= 0.1);
+    dispatchEvent(
+      new CustomEvent('userEventPreloads', { detail: { count: userEventPreloads.length } })
+    );
+
     const bundle = queue[0];
     const inverseProbability = bundle.$inverseProbability$;
     const probability = 1 - inverseProbability;
@@ -203,7 +208,21 @@ export const adjustProbabilities = (
        * too.
        */
       let newInverseProbability: number;
-      if (probability === 1 || (probability >= 0.99 && depsCount < 100)) {
+
+      /**
+       * 100 deps to be preloaded at once would mean a ~10s delay on chrome 3G throttling.
+       *
+       * This can happen for Link components as they load all of the route bundles at once, but in
+       * this case we fallback to MPA.
+       *
+       * This should never happen for a normal component. But in case it happens, we set the limit
+       * based on OVERLY_SLOW_REPRIORITIZED_PRELOADING_DEFAULT_THRESHOLD + 1 === 101 (to ensure the
+       * fallback works), because if the user has to wait for 10s before anything happens it is
+       * possible that they try to click on something else, in which case we don't want to block
+       * reprioritization of this new event bundles for too long. (If browsers supported aborting
+       * modulepreloads, we wouldn't have to do this.)
+       */
+      if (probability === 1 || (probability >= 0.99 && depsCount <= 101)) {
         depsCount++;
         // we're loaded at max probability, so elevate dynamic imports to 99% sure
         newInverseProbability = Math.min(0.01, 1 - dep.$importProbability$);
@@ -225,6 +244,7 @@ export const adjustProbabilities = (
 export const handleBundle = (name: string, inverseProbability: number) => {
   const bundle = getBundle(name);
   if (bundle && bundle.$inverseProbability$ > inverseProbability) {
+    // prioritize the event bundles first
     adjustProbabilities(bundle, inverseProbability);
   }
 };

packages/qwik/src/optimizer/src/plugins/plugin.ts

@@ -66,6 +66,11 @@ const CLIENT_STRIP_CTX_NAME = [
  * @alpha
  */
 export enum ExperimentalFeatures {
+  /**
+   * Enable falling back to MPA when SPA navigation is slow, which can happen with a big page during
+   * preloading
+   */
+  enableFallbackToMpa = 'enableFallbackToMpa',
   /** Enable the usePreventNavigate hook */
   preventNavigate = 'preventNavigate',
   /** Enable the Valibot form validation */