@tanstack/router-core 1.168.15 → 1.168.17

package/src/new-process-route-tree.ts

@@ -1023,6 +1023,7 @@ type MatchStackFrame<T extends RouteLike> = {
    * If we really really need to support more than 32 segments we can switch to using a `BigInt` here. It's about 2x slower in worst case scenarios.
    */
   skipped: number
+  /** Positional bitmasks tracking which consumed URL segments matched each segment kind. */
   statics: number
   dynamics: number
   optionals: number
@@ -1066,13 +1067,12 @@ function getNodeMatch<T extends RouteLike>(
       index: 1,
       skipped: 0,
       depth: 1,
-      statics: 1,
+      statics: 0,
       dynamics: 0,
       optionals: 0,
     },
   ]
 
-  let wildcardMatch: Frame | null = null
   let bestFuzzy: Frame | null = null
   let bestMatch: Frame | null = null
 
@@ -1081,6 +1081,18 @@ function getNodeMatch<T extends RouteLike>(
     const { node, index, skipped, depth, statics, dynamics, optionals } = frame
     let { extract, rawParams, parsedParams } = frame
 
+    // Wildcard candidates are pushed speculatively as fallbacks in case a
+    // higher-priority wildcard later fails params.parse. If a better wildcard
+    // has already validated and become bestMatch, lower-priority wildcard
+    // fallbacks cannot win anymore and should not run params.parse.
+    if (
+      node.kind === SEGMENT_TYPE_WILDCARD &&
+      node.route &&
+      !isFrameMoreSpecific(bestMatch, frame)
+    ) {
+      continue
+    }
+
     if (node.skipOnParamError) {
       const result = validateMatchParams(path, parts, frame)
       if (!result) continue
@@ -1101,7 +1113,13 @@ function getNodeMatch<T extends RouteLike>(
 
     const isBeyondPath = index === partsLength
     if (isBeyondPath) {
-      if (node.route && !pathIsIndex && isFrameMoreSpecific(bestMatch, frame)) {
+      if (
+        node.route &&
+        (!pathIsIndex ||
+          node.kind === SEGMENT_TYPE_INDEX ||
+          node.kind === SEGMENT_TYPE_WILDCARD) &&
+        isFrameMoreSpecific(bestMatch, frame)
+      ) {
         bestMatch = frame
       }
       // beyond the length of the path parts, only some segment types can match
@@ -1134,7 +1152,12 @@ function getNodeMatch<T extends RouteLike>(
       if (indexValid) {
         // perfect match, no need to continue
         // this is an optimization, algorithm should work correctly without this block
-        if (statics === partsLength && !dynamics && !optionals && !skipped) {
+        if (
+          !dynamics &&
+          !optionals &&
+          !skipped &&
+          isPerfectStaticMatch(statics, partsLength)
+        ) {
           return indexFrame
         }
         if (isFrameMoreSpecific(bestMatch, indexFrame)) {
@@ -1145,8 +1168,9 @@ function getNodeMatch<T extends RouteLike>(
     }
 
     // 5. Try wildcard match
-    if (node.wildcard && isFrameMoreSpecific(wildcardMatch, frame)) {
-      for (const segment of node.wildcard) {
+    if (node.wildcard) {
+      for (let i = node.wildcard.length - 1; i >= 0; i--) {
+        const segment = node.wildcard[i]!
         const { prefix, suffix } = segment
         if (prefix) {
           if (isBeyondPath) continue
@@ -1161,26 +1185,19 @@ function getNodeMatch<T extends RouteLike>(
           const casePart = segment.caseSensitive ? end : end.toLowerCase()
           if (casePart !== suffix) continue
         }
-        // the first wildcard match is the highest priority one
-        // wildcard matches skip the stack because they cannot have children
-        const frame = {
+        // wildcard matches consume the rest of the URL and cannot have children
+        stack.push({
           node: segment,
           index: partsLength,
           skipped,
-          depth,
+          depth: depth + 1,
           statics,
           dynamics,
           optionals,
           extract,
           rawParams,
           parsedParams,
-        }
-        if (segment.skipOnParamError) {
-          const result = validateMatchParams(path, parts, frame)
-          if (!result) continue
-        }
-        wildcardMatch = frame
-        break
+        })
       }
     }
 
@@ -1222,7 +1239,7 @@ function getNodeMatch<T extends RouteLike>(
             depth: nextDepth,
             statics,
             dynamics,
-            optionals: optionals + 1,
+            optionals: optionals + segmentScore(partsLength, index),
             extract,
             rawParams,
             parsedParams,
@@ -1249,7 +1266,7 @@ function getNodeMatch<T extends RouteLike>(
           skipped,
           depth: depth + 1,
           statics,
-          dynamics: dynamics + 1,
+          dynamics: dynamics + segmentScore(partsLength, index),
           optionals,
           extract,
           rawParams,
@@ -1269,7 +1286,7 @@ function getNodeMatch<T extends RouteLike>(
           index: index + 1,
           skipped,
           depth: depth + 1,
-          statics: statics + 1,
+          statics: statics + segmentScore(partsLength, index),
           dynamics,
           optionals,
           extract,
@@ -1288,7 +1305,7 @@ function getNodeMatch<T extends RouteLike>(
           index: index + 1,
           skipped,
           depth: depth + 1,
-          statics: statics + 1,
+          statics: statics + segmentScore(partsLength, index),
           dynamics,
           optionals,
           extract,
@@ -1319,16 +1336,8 @@ function getNodeMatch<T extends RouteLike>(
     }
   }
 
-  if (bestMatch && wildcardMatch) {
-    return isFrameMoreSpecific(wildcardMatch, bestMatch)
-      ? bestMatch
-      : wildcardMatch
-  }
-
   if (bestMatch) return bestMatch
 
-  if (wildcardMatch) return wildcardMatch
-
   if (fuzzy && bestFuzzy) {
     let sliceIndex = bestFuzzy.index
     for (let i = 0; i < bestFuzzy.index; i++) {
@@ -1343,6 +1352,19 @@ function getNodeMatch<T extends RouteLike>(
   return null
 }
 
+function segmentScore(partsLength: number, index: number): number {
+  // The specificity scores are bitmasks over consumed URL segments. Earlier
+  // URL segments should dominate later ones when comparing scores, so the
+  // first real segment gets the highest bit and the last gets bit 0. Since
+  // `parts[0]` is the empty string before the leading slash, real URL segments
+  // are [1, partsLength), making this segment's bit `partsLength - index - 1`.
+  return 2 ** (partsLength - index - 1)
+}
+
+function isPerfectStaticMatch(statics: number, partsLength: number): boolean {
+  return statics === 2 ** (partsLength - 1) - 1
+}
+
 function validateMatchParams<T extends RouteLike>(
   path: string,
   parts: Array<string>,

package/src/ssr/ssr-server.ts

@@ -1,5 +1,11 @@
 import { crossSerializeStream, getCrossReferenceHeader } from 'seroval'
 import { invariant } from '../invariant'
+import {
+  createInlineCssPlaceholderAsset,
+  createInlineCssStyleAsset,
+  getStylesheetHref,
+  isInlinableStylesheet,
+} from '../manifest'
 import { decodePath } from '../utils'
 import { createLRUCache } from '../lru-cache'
 import { rootRouteId } from '../root'
@@ -157,9 +163,11 @@ const isProd = process.env.NODE_ENV === 'production'
 type FilteredRoutes = Manifest['routes']
 
 type ManifestLRU = LRUCache<string, FilteredRoutes>
+type InlineCssLRU = LRUCache<string, string>
 
 const MANIFEST_CACHE_SIZE = 100
 const manifestCaches = new WeakMap<Manifest, ManifestLRU>()
+const inlineCssCaches = new WeakMap<Manifest, InlineCssLRU>()
 
 function getManifestCache(manifest: Manifest): ManifestLRU {
   const cache = manifestCaches.get(manifest)
@@ -169,6 +177,108 @@ function getManifestCache(manifest: Manifest): ManifestLRU {
   return newCache
 }
 
+function getInlineCssCache(manifest: Manifest): InlineCssLRU {
+  const cache = inlineCssCaches.get(manifest)
+  if (cache) return cache
+  const newCache = createLRUCache<string, string>(MANIFEST_CACHE_SIZE)
+  inlineCssCaches.set(manifest, newCache)
+  return newCache
+}
+
+function getInlineCssHrefsForMatches(
+  manifest: Manifest | undefined,
+  matches: Array<AnyRouteMatch>,
+) {
+  const styles = manifest?.inlineCss?.styles
+  if (!styles) return []
+
+  const seen = new Set<string>()
+  const hrefs: Array<string> = []
+
+  for (const match of matches) {
+    const assets = manifest?.routes[match.routeId]?.assets ?? []
+    for (const asset of assets) {
+      const href = getStylesheetHref(asset)
+      if (!href || seen.has(href) || styles[href] === undefined) {
+        continue
+      }
+      seen.add(href)
+      hrefs.push(href)
+    }
+  }
+
+  return hrefs
+}
+
+function getInlineCssForHrefs(manifest: Manifest, hrefs: Array<string>) {
+  const styles = manifest.inlineCss?.styles
+  if (!styles || hrefs.length === 0) return undefined
+
+  const cacheKey = hrefs.join('\0')
+  if (isProd) {
+    const cached = getInlineCssCache(manifest).get(cacheKey)
+    if (cached !== undefined) return cached
+  }
+
+  const css = hrefs.map((href) => styles[href]!).join('')
+
+  if (isProd) {
+    getInlineCssCache(manifest).set(cacheKey, css)
+  }
+
+  return css
+}
+
+function getInlineCssAssetForMatches(
+  manifest: Manifest | undefined,
+  matches: Array<AnyRouteMatch>,
+) {
+  if (!manifest?.inlineCss) return undefined
+
+  const hrefs = getInlineCssHrefsForMatches(manifest, matches)
+  const css = getInlineCssForHrefs(manifest, hrefs)
+
+  return css === undefined ? undefined : createInlineCssStyleAsset(css)
+}
+
+function stripInlinedStylesheetAssets(
+  manifest: Manifest,
+  routes: FilteredRoutes,
+  matches: Array<AnyRouteMatch>,
+): FilteredRoutes {
+  if (!manifest.inlineCss) {
+    return routes
+  }
+
+  const nextRoutes: FilteredRoutes = {}
+
+  for (const [routeId, route] of Object.entries(routes)) {
+    const assets = route.assets?.filter(
+      (asset) => !isInlinableStylesheet(manifest, asset),
+    )
+
+    const nextRoute = { ...route }
+    if (assets) {
+      if (assets.length > 0) {
+        nextRoute.assets = assets
+      } else {
+        delete nextRoute.assets
+      }
+    }
+    nextRoutes[routeId] = nextRoute
+  }
+
+  if (getInlineCssAssetForMatches(manifest, matches)) {
+    const rootRoute = nextRoutes[rootRouteId] ?? {}
+    nextRoutes[rootRouteId] = {
+      ...rootRoute,
+      assets: [createInlineCssPlaceholderAsset(), ...(rootRoute.assets ?? [])],
+    }
+  }
+
+  return nextRoutes
+}
+
 export function attachRouterServerSsrUtils({
   router,
   manifest,
@@ -183,7 +293,11 @@ export function attachRouterServerSsrUtils({
   router.ssr = {
     get manifest() {
       const requestAssets = getRequestAssets?.()
-      if (!requestAssets?.length) return manifest
+      const inlineCssAsset = getInlineCssAssetForMatches(
+        manifest,
+        router.stores.matches.get(),
+      )
+      if (!requestAssets?.length && !inlineCssAsset) return manifest
       // Merge request-scoped assets into root route without mutating cached manifest
       return {
         ...manifest,
@@ -192,7 +306,8 @@ export function attachRouterServerSsrUtils({
           [rootRouteId]: {
             ...manifest?.routes?.[rootRouteId],
             assets: [
-              ...requestAssets,
+              ...(requestAssets ?? []),
+              ...(inlineCssAsset ? [inlineCssAsset] : []),
               ...(manifest?.routes?.[rootRouteId]?.assets ?? []),
             ],
           },
@@ -272,15 +387,19 @@ export function attachRouterServerSsrUtils({
             }
           }
 
+          filteredRoutes = stripInlinedStylesheetAssets(
+            manifest,
+            nextFilteredRoutes,
+            matchesToDehydrate,
+          )
+
           if (isProd) {
-            getManifestCache(manifest).set(manifestCacheKey, nextFilteredRoutes)
+            getManifestCache(manifest).set(manifestCacheKey, filteredRoutes)
           }
-
-          filteredRoutes = nextFilteredRoutes
         }
 
         manifestToDehydrate = {
-          routes: filteredRoutes,
+          routes: { ...filteredRoutes },
         }
 
         // Merge request-scoped assets into root route (without mutating cached manifest)