Merge pull request #7598 from QwikDev/v2-merge-main

chore: merge main into v2

Author: wmertens

.github/assets/qwik-logo.svg

@@ -1,6 +1,6 @@
 <br>
 <p align="center">
-  <img alt="Qwik Logo" width="400" src="https://raw.githubusercontent.com/QwikDev/qwik/main/.github/assets/qwik-logo.svg" />
+  <img alt="Qwik Logo" width="400" src="https://raw.githubusercontent.com/QwikDev/qwik/main/packages/docs/public/logos/qwik.svg" />
 </p>
 <br>
 <p align="center">

README.md

@@ -6,7 +6,7 @@ import Root from './root';
 const preloaderSettings = [
   'ssrPreloads',
   'ssrPreloadProbability',
-  'maxBufferedPreloads',
+  'maxIdlePreloads',
   'preloadProbability',
 ] as const;
 

packages/docs/public/logos/qwik-logo.svg

@@ -124,7 +124,7 @@
         }
       ],
       "kind": "Interface",
-      "content": "```typescript\nexport interface PreloaderOptions \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[debug?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_ Log preloader debug information to the console.\n\nDefaults to `false`\n\n\n</td></tr>\n<tr><td>\n\n[maxBufferedPreloads?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ Maximum number of simultaneous preload links that the preloader will maintain. If you set this higher, the browser will have all JS files in memory sooner, but it will contend with other resource downloads. Furthermore, if a bundle suddenly becomes more likely, it will have to wait longer to be preloaded.\n\nBundles that reach 100% probability (static imports of other bundles) will always be preloaded immediately, no limit.\n\nDefaults to `25`\n\n\n</td></tr>\n<tr><td>\n\n[preloadProbability?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ The minimum probability for a bundle to be added to the preload queue.\n\nDefaults to `0.35` (35% probability)\n\n\n</td></tr>\n<tr><td>\n\n[ssrPreloadProbability?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ The minimum probability for a bundle to be added as a preload link during SSR.\n\nDefaults to `0.7` (70% probability)\n\n\n</td></tr>\n<tr><td>\n\n[ssrPreloads?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ Maximum number of preload links to add during SSR. These instruct the browser to preload likely bundles before the preloader script is active. This most likely includes the core and the preloader script itself. Setting this to 0 will disable all preload links.\n\nPreload links can delay LCP, which is a Core Web Vital, but it can increase TTI, which is not a Core Web Vital but more noticeable to the user.\n\nDefaults to `5`\n\n\n</td></tr>\n</tbody></table>",
+      "content": "```typescript\nexport interface PreloaderOptions \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[debug?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nboolean\n\n\n</td><td>\n\n_(Optional)_ Log preloader debug information to the console.\n\nDefaults to `false`\n\n\n</td></tr>\n<tr><td>\n\n[maxIdlePreloads?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ Maximum number of simultaneous preload links that the preloader will maintain. If you set this higher, the browser will have all JS files in memory sooner, but it will contend with other resource downloads. Furthermore, if a bundle suddenly becomes more likely, it will have to wait longer to be preloaded.\n\nBundles that reach 100% probability (static imports of other bundles) will always be preloaded immediately, no limit.\n\nDefaults to `25`\n\n\n</td></tr>\n<tr><td>\n\n[preloadProbability?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ The minimum probability for a bundle to be added to the preload queue.\n\nDefaults to `0.35` (35% probability)\n\n\n</td></tr>\n<tr><td>\n\n[ssrPreloadProbability?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ The minimum probability for a bundle to be added as a preload link during SSR.\n\nDefaults to `0.7` (70% probability)\n\n\n</td></tr>\n<tr><td>\n\n[ssrPreloads?](#)\n\n\n</td><td>\n\n\n</td><td>\n\nnumber\n\n\n</td><td>\n\n_(Optional)_ Maximum number of preload links to add during SSR. These instruct the browser to preload likely bundles before the preloader script is active. This most likely includes the core and the preloader script itself. Setting this to 0 will disable all preload links.\n\nPreload links can delay LCP, which is a Core Web Vital, but it can increase TTI, which is not a Core Web Vital but more noticeable to the user.\n\nDefaults to `5`\n\n\n</td></tr>\n</tbody></table>",
       "editUrl": "https://github.com/QwikDev/qwik/tree/main/packages/qwik/src/server/types.ts",
       "mdFile": "core.preloaderoptions.md"
     },

packages/docs/public/logos/qwik.svg

@@ -466,7 +466,7 @@ Defaults to `false`
 </td></tr>
 <tr><td>
 
-[maxBufferedPreloads?](#)
+[maxIdlePreloads?](#)
 
 </td><td>
 

packages/docs/src/entry.ssr.tsx

@@ -5,18 +5,21 @@ import {
   Slot,
   sync$,
   untrack,
+  useSignal,
+  useVisibleTask$,
   type QwikIntrinsicElements,
 } from '@qwik.dev/core';
 import { prefetchSymbols } from './client-navigate';
 import { loadClientData } from './use-endpoint';
 import { useLocation, useNavigate } from './use-functions';
-import { getClientNavPath, shouldPrefetchData, shouldPrefetchSymbols } from './utils';
+import { getClientNavPath, shouldPreload } from './utils';
 
 /** @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,
@@ -29,18 +32,13 @@ export const Link = component$<LinkProps>((props) => {
   linkProps.href = clientNavPath || originalHref;
 
   const prefetchData = untrack(
-    () =>
-      (!!clientNavPath &&
-        prefetchProp !== false &&
-        prefetchProp !== 'js' &&
-        shouldPrefetchData(clientNavPath, loc)) ||
-      undefined
+    () => (!!clientNavPath && prefetchProp !== false && prefetchProp !== 'js') || undefined
   );
 
   const prefetch = untrack(
     () =>
       prefetchData ||
-      (!!clientNavPath && prefetchProp !== false && shouldPrefetchSymbols(clientNavPath, loc))
+      (!!clientNavPath && prefetchProp !== false && shouldPreload(clientNavPath, loc))
   );
 
   const handlePrefetch = prefetch
@@ -81,17 +79,25 @@ export const Link = component$<LinkProps>((props) => {
         }
       })
     : undefined;
+
+  useVisibleTask$(({ track }) => {
+    track(() => loc.url.pathname);
+    // Don't prefetch on visible in dev mode
+    if (!isDev && anchorRef.value) {
+      handlePrefetch?.(undefined, anchorRef.value!);
+    }
+  });
+
   return (
     <a
+      ref={anchorRef}
       // Attr 'q:link' is used as a selector for bootstrapping into spa after context loss
       {...{ 'q:link': !!clientNavPath }}
       {...linkProps}
       onClick$={[preventDefault, onClick$, handleClick]}
       data-prefetch={prefetchData}
       onMouseOver$={[linkProps.onMouseOver$, handlePrefetch]}
       onFocus$={[linkProps.onFocus$, handlePrefetch]}
-      // Don't prefetch on visible in dev mode
-      onQVisible$={[linkProps.onQVisible$, !isDev ? handlePrefetch : undefined]}
     >
       <Slot />
     </a>

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

@@ -58,16 +58,7 @@ export const getClientNavPath = (props: Record<string, any>, baseUrl: { url: URL
   return null;
 };
 
-export const shouldPrefetchData = (clientNavPath: string | null, currentLoc: { url: URL }) => {
-  if (clientNavPath) {
-    const prefetchUrl = toUrl(clientNavPath, currentLoc.url);
-    const currentUrl = toUrl('', currentLoc.url);
-    return !isSamePath(prefetchUrl, currentUrl);
-  }
-  return false;
-};
-
-export const shouldPrefetchSymbols = (clientNavPath: string | null, currentLoc: { url: URL }) => {
+export const shouldPreload = (clientNavPath: string | null, currentLoc: { url: URL }) => {
   if (clientNavPath) {
     const prefetchUrl = toUrl(clientNavPath, currentLoc.url);
     const currentUrl = toUrl('', currentLoc.url);