@tanstack/router-core 1.131.3 → 1.131.5

package/dist/esm/ssr/ssr-client.js

@@ -1,16 +1,14 @@
 import invariant from "tiny-invariant";
 import { batch } from "@tanstack/store";
 import { createControlledPromise } from "../utils.js";
-function hydrateMatch(deyhydratedMatch) {
-  return {
-    id: deyhydratedMatch.i,
-    __beforeLoadContext: deyhydratedMatch.b,
-    loaderData: deyhydratedMatch.l,
-    status: deyhydratedMatch.s,
-    ssr: deyhydratedMatch.ssr,
-    updatedAt: deyhydratedMatch.u,
-    error: deyhydratedMatch.e
-  };
+function hydrateMatch(match, deyhydratedMatch) {
+  match.id = deyhydratedMatch.i;
+  match.__beforeLoadContext = deyhydratedMatch.b;
+  match.loaderData = deyhydratedMatch.l;
+  match.status = deyhydratedMatch.s;
+  match.ssr = deyhydratedMatch.ssr;
+  match.updatedAt = deyhydratedMatch.u;
+  match.error = deyhydratedMatch.e;
 }
 async function hydrate(router) {
   var _a, _b, _c;
@@ -34,15 +32,17 @@ async function hydrate(router) {
     const pendingMinMs = route.options.pendingMinMs ?? router.options.defaultPendingMinMs;
     if (pendingMinMs) {
       const minPendingPromise = createControlledPromise();
-      match.minPendingPromise = minPendingPromise;
+      match._nonReactive.minPendingPromise = minPendingPromise;
       match._forcePending = true;
       setTimeout(() => {
         minPendingPromise.resolve();
-        router.updateMatch(match.id, (prev) => ({
-          ...prev,
-          minPendingPromise: void 0,
-          _forcePending: void 0
-        }));
+        router.updateMatch(match.id, (prev) => {
+          prev._nonReactive.minPendingPromise = void 0;
+          return {
+            ...prev,
+            _forcePending: void 0
+          };
+        });
       }, pendingMinMs);
     }
   }
@@ -52,15 +52,12 @@ async function hydrate(router) {
       (d) => d.i === match.id
     );
     if (!dehydratedMatch) {
-      Object.assign(match, { dehydrated: false, ssr: false });
+      match._nonReactive.dehydrated = false;
+      match.ssr = false;
       return;
     }
-    Object.assign(match, hydrateMatch(dehydratedMatch));
-    if (match.ssr === false) {
-      match._dehydrated = false;
-    } else {
-      match._dehydrated = true;
-    }
+    hydrateMatch(match, dehydratedMatch);
+    match._nonReactive.dehydrated = match.ssr !== false;
     if (match.ssr === "data-only" || match.ssr === false) {
       if (firstNonSsrMatchIndex === void 0) {
         firstNonSsrMatchIndex = match.index;
@@ -77,23 +74,25 @@ async function hydrate(router) {
   await ((_c = (_b = router.options).hydrate) == null ? void 0 : _c.call(_b, dehydratedData));
   await Promise.all(
     router.state.matches.map(async (match) => {
-      var _a2, _b2, _c2, _d, _e, _f;
+      var _a2, _b2, _c2, _d;
       const route = router.looseRoutesById[match.routeId];
       const parentMatch = router.state.matches[match.index - 1];
-      const parentContext = (parentMatch == null ? void 0 : parentMatch.context) ?? router.options.context ?? {};
-      const contextFnContext = {
-        deps: match.loaderDeps,
-        params: match.params,
-        context: parentContext,
-        location: router.state.location,
-        navigate: (opts) => router.navigate({ ...opts, _fromLocation: router.state.location }),
-        buildLocation: router.buildLocation,
-        cause: match.cause,
-        abortController: match.abortController,
-        preload: false,
-        matches
-      };
-      match.__routeContext = ((_b2 = (_a2 = route.options).context) == null ? void 0 : _b2.call(_a2, contextFnContext)) ?? {};
+      const parentContext = (parentMatch == null ? void 0 : parentMatch.context) ?? router.options.context;
+      if (route.options.context) {
+        const contextFnContext = {
+          deps: match.loaderDeps,
+          params: match.params,
+          context: parentContext ?? {},
+          location: router.state.location,
+          navigate: (opts) => router.navigate({ ...opts, _fromLocation: router.state.location }),
+          buildLocation: router.buildLocation,
+          cause: match.cause,
+          abortController: match.abortController,
+          preload: false,
+          matches
+        };
+        match.__routeContext = route.options.context(contextFnContext) ?? void 0;
+      }
       match.context = {
         ...parentContext,
         ...match.__routeContext,
@@ -105,8 +104,8 @@ async function hydrate(router) {
         params: match.params,
         loaderData: match.loaderData
       };
-      const headFnContent = await ((_d = (_c2 = route.options).head) == null ? void 0 : _d.call(_c2, assetContext));
-      const scripts = await ((_f = (_e = route.options).scripts) == null ? void 0 : _f.call(_e, assetContext));
+      const headFnContent = await ((_b2 = (_a2 = route.options).head) == null ? void 0 : _b2.call(_a2, assetContext));
+      const scripts = await ((_d = (_c2 = route.options).scripts) == null ? void 0 : _d.call(_c2, assetContext));
       match.meta = headFnContent == null ? void 0 : headFnContent.meta;
       match.links = headFnContent == null ? void 0 : headFnContent.links;
       match.headScripts = headFnContent == null ? void 0 : headFnContent.scripts;
@@ -118,7 +117,7 @@ async function hydrate(router) {
   const hasSsrFalseMatches = matches.some((m) => m.ssr === false);
   if (!hasSsrFalseMatches && !isSpaMode) {
     matches.forEach((match) => {
-      match._dehydrated = void 0;
+      match._nonReactive.dehydrated = void 0;
     });
     return routeChunkPromise;
   }
@@ -133,7 +132,7 @@ async function hydrate(router) {
     );
     setMatchForcePending(match);
     match._displayPending = true;
-    match.displayPendingPromise = loadPromise;
+    match._nonReactive.displayPendingPromise = loadPromise;
     loadPromise.then(() => {
       batch(() => {
         if (router.__store.state.status === "pending") {

package/dist/esm/ssr/ssr-client.js.map

@@ -1 +1 @@
-{"version":3,"file":"ssr-client.js","sources":["../../../src/ssr/ssr-client.ts"],"sourcesContent":["import invariant from 'tiny-invariant'\nimport { batch } from '@tanstack/store'\nimport { createControlledPromise } from '../utils'\nimport type { AnyRouteMatch, MakeRouteMatch } from '../Matches'\nimport type { AnyRouter } from '../router'\nimport type { Manifest } from '../manifest'\nimport type { RouteContextOptions } from '../route'\nimport type { GLOBAL_TSR } from './ssr-server'\n\ndeclare global {\n  interface Window {\n    [GLOBAL_TSR]?: TsrSsrGlobal\n  }\n}\n\nexport interface TsrSsrGlobal {\n  router?: DehydratedRouter\n  // clean scripts, shortened since this is sent for each streamed script\n  c: () => void\n}\n\nfunction hydrateMatch(\n  deyhydratedMatch: DehydratedMatch,\n): Partial<MakeRouteMatch> {\n  return {\n    id: deyhydratedMatch.i,\n    __beforeLoadContext: deyhydratedMatch.b,\n    loaderData: deyhydratedMatch.l,\n    status: deyhydratedMatch.s,\n    ssr: deyhydratedMatch.ssr,\n    updatedAt: deyhydratedMatch.u,\n    error: deyhydratedMatch.e,\n  }\n}\nexport interface DehydratedMatch {\n  i: MakeRouteMatch['id']\n  b?: MakeRouteMatch['__beforeLoadContext']\n  l?: MakeRouteMatch['loaderData']\n  e?: MakeRouteMatch['error']\n  u: MakeRouteMatch['updatedAt']\n  s: MakeRouteMatch['status']\n  ssr?: MakeRouteMatch['ssr']\n}\n\nexport interface DehydratedRouter {\n  manifest: Manifest | undefined\n  dehydratedData?: any\n  lastMatchId?: string\n  matches: Array<DehydratedMatch>\n}\n\nexport async function hydrate(router: AnyRouter): Promise<any> {\n  invariant(\n    window.$_TSR?.router,\n    'Expected to find a dehydrated data on window.$_TSR.router, but we did not. Please file an issue!',\n  )\n\n  const { manifest, dehydratedData, lastMatchId } = window.$_TSR.router\n\n  router.ssr = {\n    manifest,\n  }\n\n  // Hydrate the router state\n  const matches = router.matchRoutes(router.state.location)\n\n  // kick off loading the route chunks\n  const routeChunkPromise = Promise.all(\n    matches.map((match) => {\n      const route = router.looseRoutesById[match.routeId]!\n      return router.loadRouteChunk(route)\n    }),\n  )\n\n  function setMatchForcePending(match: AnyRouteMatch) {\n    // usually the minPendingPromise is created in the Match component if a pending match is rendered\n    // however, this might be too late if the match synchronously resolves\n    const route = router.looseRoutesById[match.routeId]!\n    const pendingMinMs =\n      route.options.pendingMinMs ?? router.options.defaultPendingMinMs\n    if (pendingMinMs) {\n      const minPendingPromise = createControlledPromise<void>()\n      match.minPendingPromise = minPendingPromise\n      match._forcePending = true\n\n      setTimeout(() => {\n        minPendingPromise.resolve()\n        // We've handled the minPendingPromise, so we can delete it\n        router.updateMatch(match.id, (prev) => ({\n          ...prev,\n          minPendingPromise: undefined,\n          _forcePending: undefined,\n        }))\n      }, pendingMinMs)\n    }\n  }\n\n  // Right after hydration and before the first render, we need to rehydrate each match\n  // First step is to reyhdrate loaderData and __beforeLoadContext\n  let firstNonSsrMatchIndex: number | undefined = undefined\n  matches.forEach((match) => {\n    const dehydratedMatch = window.$_TSR!.router!.matches.find(\n      (d) => d.i === match.id,\n    )\n    if (!dehydratedMatch) {\n      Object.assign(match, { dehydrated: false, ssr: false })\n      return\n    }\n\n    Object.assign(match, hydrateMatch(dehydratedMatch))\n\n    if (match.ssr === false) {\n      match._dehydrated = false\n    } else {\n      match._dehydrated = true\n    }\n\n    if (match.ssr === 'data-only' || match.ssr === false) {\n      if (firstNonSsrMatchIndex === undefined) {\n        firstNonSsrMatchIndex = match.index\n        setMatchForcePending(match)\n      }\n    }\n  })\n\n  router.__store.setState((s) => {\n    return {\n      ...s,\n      matches,\n    }\n  })\n\n  // Allow the user to handle custom hydration data\n  await router.options.hydrate?.(dehydratedData)\n\n  // now that all necessary data is hydrated:\n  // 1) fully reconstruct the route context\n  // 2) execute `head()` and `scripts()` for each match\n  await Promise.all(\n    router.state.matches.map(async (match) => {\n      const route = router.looseRoutesById[match.routeId]!\n\n      const parentMatch = router.state.matches[match.index - 1]\n      const parentContext = parentMatch?.context ?? router.options.context ?? {}\n\n      // `context()` was already executed by `matchRoutes`, however route context was not yet fully reconstructed\n      // so run it again and merge route context\n      const contextFnContext: RouteContextOptions<any, any, any, any> = {\n        deps: match.loaderDeps,\n        params: match.params,\n        context: parentContext,\n        location: router.state.location,\n        navigate: (opts: any) =>\n          router.navigate({ ...opts, _fromLocation: router.state.location }),\n        buildLocation: router.buildLocation,\n        cause: match.cause,\n        abortController: match.abortController,\n        preload: false,\n        matches,\n      }\n      match.__routeContext = route.options.context?.(contextFnContext) ?? {}\n\n      match.context = {\n        ...parentContext,\n        ...match.__routeContext,\n        ...match.__beforeLoadContext,\n      }\n\n      const assetContext = {\n        matches: router.state.matches,\n        match,\n        params: match.params,\n        loaderData: match.loaderData,\n      }\n      const headFnContent = await route.options.head?.(assetContext)\n\n      const scripts = await route.options.scripts?.(assetContext)\n\n      match.meta = headFnContent?.meta\n      match.links = headFnContent?.links\n      match.headScripts = headFnContent?.scripts\n      match.styles = headFnContent?.styles\n      match.scripts = scripts\n    }),\n  )\n\n  const isSpaMode = matches[matches.length - 1]!.id !== lastMatchId\n  const hasSsrFalseMatches = matches.some((m) => m.ssr === false)\n  // all matches have data from the server   and we are not in SPA mode so we don't need to kick of router.load()\n  if (!hasSsrFalseMatches && !isSpaMode) {\n    matches.forEach((match) => {\n      // remove the _dehydrate flag since we won't run router.load() which would remove it\n      match._dehydrated = undefined\n    })\n    return routeChunkPromise\n  }\n\n  // schedule router.load() to run after the next tick so we can store the promise in the match before loading starts\n  const loadPromise = Promise.resolve()\n    .then(() => router.load())\n    .catch((err) => {\n      console.error('Error during router hydration:', err)\n    })\n\n  // in SPA mode we need to keep the first match below the root route pending until router.load() is finished\n  // this will prevent that other pending components are rendered but hydration is not blocked\n  if (isSpaMode) {\n    const match = matches[1]\n    invariant(\n      match,\n      'Expected to find a match below the root match in SPA mode.',\n    )\n    setMatchForcePending(match)\n\n    match._displayPending = true\n    match.displayPendingPromise = loadPromise\n\n    loadPromise.then(() => {\n      batch(() => {\n        // ensure router is not in status 'pending' anymore\n        // this usually happens in Transitioner but if loading synchronously resolves,\n        // Transitioner won't be rendered while loading so it cannot track the change from loading:true to loading:false\n        if (router.__store.state.status === 'pending') {\n          router.__store.setState((s) => ({\n            ...s,\n            status: 'idle',\n            resolvedLocation: s.location,\n          }))\n        }\n        // hide the pending component once the load is finished\n        router.updateMatch(match.id, (prev) => {\n          return {\n            ...prev,\n            _displayPending: undefined,\n            displayPendingPromise: undefined,\n          }\n        })\n      })\n    })\n  }\n  return routeChunkPromise\n}\n"],"names":["_b","_a","_c"],"mappings":"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"}
+{"version":3,"file":"ssr-client.js","sources":["../../../src/ssr/ssr-client.ts"],"sourcesContent":["import invariant from 'tiny-invariant'\nimport { batch } from '@tanstack/store'\nimport { createControlledPromise } from '../utils'\nimport type { AnyRouteMatch, MakeRouteMatch } from '../Matches'\nimport type { AnyRouter } from '../router'\nimport type { Manifest } from '../manifest'\nimport type { RouteContextOptions } from '../route'\nimport type { GLOBAL_TSR } from './ssr-server'\n\ndeclare global {\n  interface Window {\n    [GLOBAL_TSR]?: TsrSsrGlobal\n  }\n}\n\nexport interface TsrSsrGlobal {\n  router?: DehydratedRouter\n  // clean scripts, shortened since this is sent for each streamed script\n  c: () => void\n}\n\nfunction hydrateMatch(\n  match: AnyRouteMatch,\n  deyhydratedMatch: DehydratedMatch,\n): void {\n  match.id = deyhydratedMatch.i\n  match.__beforeLoadContext = deyhydratedMatch.b\n  match.loaderData = deyhydratedMatch.l\n  match.status = deyhydratedMatch.s\n  match.ssr = deyhydratedMatch.ssr\n  match.updatedAt = deyhydratedMatch.u\n  match.error = deyhydratedMatch.e\n}\nexport interface DehydratedMatch {\n  i: MakeRouteMatch['id']\n  b?: MakeRouteMatch['__beforeLoadContext']\n  l?: MakeRouteMatch['loaderData']\n  e?: MakeRouteMatch['error']\n  u: MakeRouteMatch['updatedAt']\n  s: MakeRouteMatch['status']\n  ssr?: MakeRouteMatch['ssr']\n}\n\nexport interface DehydratedRouter {\n  manifest: Manifest | undefined\n  dehydratedData?: any\n  lastMatchId?: string\n  matches: Array<DehydratedMatch>\n}\n\nexport async function hydrate(router: AnyRouter): Promise<any> {\n  invariant(\n    window.$_TSR?.router,\n    'Expected to find a dehydrated data on window.$_TSR.router, but we did not. Please file an issue!',\n  )\n\n  const { manifest, dehydratedData, lastMatchId } = window.$_TSR.router\n\n  router.ssr = {\n    manifest,\n  }\n\n  // Hydrate the router state\n  const matches = router.matchRoutes(router.state.location)\n\n  // kick off loading the route chunks\n  const routeChunkPromise = Promise.all(\n    matches.map((match) => {\n      const route = router.looseRoutesById[match.routeId]!\n      return router.loadRouteChunk(route)\n    }),\n  )\n\n  function setMatchForcePending(match: AnyRouteMatch) {\n    // usually the minPendingPromise is created in the Match component if a pending match is rendered\n    // however, this might be too late if the match synchronously resolves\n    const route = router.looseRoutesById[match.routeId]!\n    const pendingMinMs =\n      route.options.pendingMinMs ?? router.options.defaultPendingMinMs\n    if (pendingMinMs) {\n      const minPendingPromise = createControlledPromise<void>()\n      match._nonReactive.minPendingPromise = minPendingPromise\n      match._forcePending = true\n\n      setTimeout(() => {\n        minPendingPromise.resolve()\n        // We've handled the minPendingPromise, so we can delete it\n        router.updateMatch(match.id, (prev) => {\n          prev._nonReactive.minPendingPromise = undefined\n          return {\n            ...prev,\n            _forcePending: undefined,\n          }\n        })\n      }, pendingMinMs)\n    }\n  }\n\n  // Right after hydration and before the first render, we need to rehydrate each match\n  // First step is to reyhdrate loaderData and __beforeLoadContext\n  let firstNonSsrMatchIndex: number | undefined = undefined\n  matches.forEach((match) => {\n    const dehydratedMatch = window.$_TSR!.router!.matches.find(\n      (d) => d.i === match.id,\n    )\n    if (!dehydratedMatch) {\n      match._nonReactive.dehydrated = false\n      match.ssr = false\n      return\n    }\n\n    hydrateMatch(match, dehydratedMatch)\n\n    match._nonReactive.dehydrated = match.ssr !== false\n\n    if (match.ssr === 'data-only' || match.ssr === false) {\n      if (firstNonSsrMatchIndex === undefined) {\n        firstNonSsrMatchIndex = match.index\n        setMatchForcePending(match)\n      }\n    }\n  })\n\n  router.__store.setState((s) => {\n    return {\n      ...s,\n      matches,\n    }\n  })\n\n  // Allow the user to handle custom hydration data\n  await router.options.hydrate?.(dehydratedData)\n\n  // now that all necessary data is hydrated:\n  // 1) fully reconstruct the route context\n  // 2) execute `head()` and `scripts()` for each match\n  await Promise.all(\n    router.state.matches.map(async (match) => {\n      const route = router.looseRoutesById[match.routeId]!\n\n      const parentMatch = router.state.matches[match.index - 1]\n      const parentContext = parentMatch?.context ?? router.options.context\n\n      // `context()` was already executed by `matchRoutes`, however route context was not yet fully reconstructed\n      // so run it again and merge route context\n      if (route.options.context) {\n        const contextFnContext: RouteContextOptions<any, any, any, any> = {\n          deps: match.loaderDeps,\n          params: match.params,\n          context: parentContext ?? {},\n          location: router.state.location,\n          navigate: (opts: any) =>\n            router.navigate({ ...opts, _fromLocation: router.state.location }),\n          buildLocation: router.buildLocation,\n          cause: match.cause,\n          abortController: match.abortController,\n          preload: false,\n          matches,\n        }\n        match.__routeContext =\n          route.options.context(contextFnContext) ?? undefined\n      }\n\n      match.context = {\n        ...parentContext,\n        ...match.__routeContext,\n        ...match.__beforeLoadContext,\n      }\n\n      const assetContext = {\n        matches: router.state.matches,\n        match,\n        params: match.params,\n        loaderData: match.loaderData,\n      }\n      const headFnContent = await route.options.head?.(assetContext)\n\n      const scripts = await route.options.scripts?.(assetContext)\n\n      match.meta = headFnContent?.meta\n      match.links = headFnContent?.links\n      match.headScripts = headFnContent?.scripts\n      match.styles = headFnContent?.styles\n      match.scripts = scripts\n    }),\n  )\n\n  const isSpaMode = matches[matches.length - 1]!.id !== lastMatchId\n  const hasSsrFalseMatches = matches.some((m) => m.ssr === false)\n  // all matches have data from the server and we are not in SPA mode so we don't need to kick of router.load()\n  if (!hasSsrFalseMatches && !isSpaMode) {\n    matches.forEach((match) => {\n      // remove the dehydrated flag since we won't run router.load() which would remove it\n      match._nonReactive.dehydrated = undefined\n    })\n    return routeChunkPromise\n  }\n\n  // schedule router.load() to run after the next tick so we can store the promise in the match before loading starts\n  const loadPromise = Promise.resolve()\n    .then(() => router.load())\n    .catch((err) => {\n      console.error('Error during router hydration:', err)\n    })\n\n  // in SPA mode we need to keep the first match below the root route pending until router.load() is finished\n  // this will prevent that other pending components are rendered but hydration is not blocked\n  if (isSpaMode) {\n    const match = matches[1]\n    invariant(\n      match,\n      'Expected to find a match below the root match in SPA mode.',\n    )\n    setMatchForcePending(match)\n\n    match._displayPending = true\n    match._nonReactive.displayPendingPromise = loadPromise\n\n    loadPromise.then(() => {\n      batch(() => {\n        // ensure router is not in status 'pending' anymore\n        // this usually happens in Transitioner but if loading synchronously resolves,\n        // Transitioner won't be rendered while loading so it cannot track the change from loading:true to loading:false\n        if (router.__store.state.status === 'pending') {\n          router.__store.setState((s) => ({\n            ...s,\n            status: 'idle',\n            resolvedLocation: s.location,\n          }))\n        }\n        // hide the pending component once the load is finished\n        router.updateMatch(match.id, (prev) => {\n          return {\n            ...prev,\n            _displayPending: undefined,\n            displayPendingPromise: undefined,\n          }\n        })\n      })\n    })\n  }\n  return routeChunkPromise\n}\n"],"names":["_b","_a","_c"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/router-core",
-  "version": "1.131.3",
+  "version": "1.131.5",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",

package/src/Matches.ts

@@ -136,14 +136,21 @@ export interface RouteMatch<
   paramsError: unknown
   searchError: unknown
   updatedAt: number
-  loadPromise?: ControlledPromise<void>
-  /** @internal */
-  beforeLoadPromise?: ControlledPromise<void>
-  /** @internal */
-  loaderPromise?: ControlledPromise<void>
+  _nonReactive: {
+    /** @internal */
+    beforeLoadPromise?: ControlledPromise<void>
+    /** @internal */
+    loaderPromise?: ControlledPromise<void>
+    /** @internal */
+    pendingTimeout?: ReturnType<typeof setTimeout>
+    loadPromise?: ControlledPromise<void>
+    displayPendingPromise?: Promise<void>
+    minPendingPromise?: ControlledPromise<void>
+    dehydrated?: boolean
+  }
   loaderData?: TLoaderData
   /** @internal */
-  __routeContext: Record<string, unknown>
+  __routeContext?: Record<string, unknown>
   /** @internal */
   __beforeLoadContext?: Record<string, unknown>
   context: TAllContext
@@ -158,12 +165,9 @@ export interface RouteMatch<
   headers?: Record<string, string>
   globalNotFound?: boolean
   staticData: StaticDataRouteOption
-  minPendingPromise?: ControlledPromise<void>
-  pendingTimeout?: ReturnType<typeof setTimeout>
+  /** This attribute is not reactive */
   ssr?: boolean | 'data-only'
-  _dehydrated?: boolean
   _forcePending?: boolean
-  displayPendingPromise?: Promise<void>
   _displayPending?: boolean
 }
 

package/src/router.ts

@@ -1146,8 +1146,8 @@ export class RouterCore<
       const parentMatchId = parentMatch?.id
 
       const parentContext = !parentMatchId
-        ? ((this.options.context as any) ?? {})
-        : (parentMatch.context ?? this.options.context ?? {})
+        ? ((this.options.context as any) ?? undefined)
+        : (parentMatch.context ?? this.options.context ?? undefined)
 
       return parentContext
     }
@@ -1169,12 +1169,12 @@ export class RouterCore<
       ] = (() => {
         // Validate the search params and stabilize them
         const parentSearch = parentMatch?.search ?? next.search
-        const parentStrictSearch = parentMatch?._strictSearch ?? {}
+        const parentStrictSearch = parentMatch?._strictSearch ?? undefined
 
         try {
           const strictSearch =
             validateSearch(route.options.validateSearch, { ...parentSearch }) ??
-            {}
+            undefined
 
           return [
             {
@@ -1284,7 +1284,10 @@ export class RouterCore<
           isFetching: false,
           error: undefined,
           paramsError: parseErrors[index],
-          __routeContext: {},
+          __routeContext: undefined,
+          _nonReactive: {
+            loadPromise: createControlledPromise(),
+          },
           __beforeLoadContext: undefined,
           context: {},
           abortController: new AbortController(),
@@ -1300,7 +1303,6 @@ export class RouterCore<
           headScripts: undefined,
           meta: undefined,
           staticData: route.options.staticData || {},
-          loadPromise: createControlledPromise(),
           fullPath: route.fullPath,
         }
       }
@@ -1335,22 +1337,25 @@ export class RouterCore<
         const parentContext = getParentContext(parentMatch)
 
         // Update the match's context
-        const contextFnContext: RouteContextOptions<any, any, any, any> = {
-          deps: match.loaderDeps,
-          params: match.params,
-          context: parentContext,
-          location: next,
-          navigate: (opts: any) =>
-            this.navigate({ ...opts, _fromLocation: next }),
-          buildLocation: this.buildLocation,
-          cause: match.cause,
-          abortController: match.abortController,
-          preload: !!match.preload,
-          matches,
-        }
 
-        // Get the route context
-        match.__routeContext = route.options.context?.(contextFnContext) ?? {}
+        if (route.options.context) {
+          const contextFnContext: RouteContextOptions<any, any, any, any> = {
+            deps: match.loaderDeps,
+            params: match.params,
+            context: parentContext ?? {},
+            location: next,
+            navigate: (opts: any) =>
+              this.navigate({ ...opts, _fromLocation: next }),
+            buildLocation: this.buildLocation,
+            cause: match.cause,
+            abortController: match.abortController,
+            preload: !!match.preload,
+            matches,
+          }
+          // Get the route context
+          match.__routeContext =
+            route.options.context(contextFnContext) ?? undefined
+        }
 
         match.context = {
           ...parentContext,
@@ -1388,13 +1393,8 @@ export class RouterCore<
     if (!match) return
 
     match.abortController.abort()
-    this.updateMatch(id, (prev) => {
-      clearTimeout(prev.pendingTimeout)
-      return {
-        ...prev,
-        pendingTimeout: undefined,
-      }
-    })
+    match._nonReactive.pendingTimeout = undefined
+    clearTimeout(match._nonReactive.pendingTimeout)
   }
 
   cancelMatches = () => {
@@ -1489,13 +1489,9 @@ export class RouterCore<
         parseCache: this.parsePathnameCache,
       }).interpolatedPath
 
-      const destRoutes = this.matchRoutes(
-        interpolatedNextTo,
-        {},
-        {
-          _buildLocation: true,
-        },
-      ).map((d) => this.looseRoutesById[d.routeId]!)
+      const destRoutes = this.matchRoutes(interpolatedNextTo, undefined, {
+        _buildLocation: true,
+      }).map((d) => this.looseRoutesById[d.routeId]!)
 
       // If there are any params, we need to stringify them
       if (Object.keys(nextParams).length > 0) {
@@ -2133,8 +2129,10 @@ export class RouterCore<
           }
         }
 
-        match.beforeLoadPromise?.resolve()
-        match.loaderPromise?.resolve()
+        match._nonReactive.beforeLoadPromise?.resolve()
+        match._nonReactive.loaderPromise?.resolve()
+        match._nonReactive.beforeLoadPromise = undefined
+        match._nonReactive.loaderPromise = undefined
 
         updateMatch(match.id, (prev) => ({
           ...prev,
@@ -2145,15 +2143,13 @@ export class RouterCore<
               : 'error',
           isFetching: false,
           error: err,
-          beforeLoadPromise: undefined,
-          loaderPromise: undefined,
         }))
 
         if (!(err as any).routeId) {
           ;(err as any).routeId = match.routeId
         }
 
-        match.loadPromise?.resolve()
+        match._nonReactive.loadPromise?.resolve()
 
         if (isRedirect(err)) {
           rendered = true
@@ -2173,7 +2169,7 @@ export class RouterCore<
     const shouldSkipLoader = (matchId: string) => {
       const match = this.getMatch(matchId)!
       // upon hydration, we skip the loader if the match has been dehydrated on the server
-      if (!this.isServer && match._dehydrated) {
+      if (!this.isServer && match._nonReactive.dehydrated) {
         return true
       }
 
@@ -2216,8 +2212,9 @@ export class RouterCore<
               }
 
               updateMatch(matchId, (prev) => {
-                prev.beforeLoadPromise?.resolve()
-                prev.loadPromise?.resolve()
+                prev._nonReactive.beforeLoadPromise?.resolve()
+                prev._nonReactive.beforeLoadPromise = undefined
+                prev._nonReactive.loadPromise?.resolve()
 
                 return {
                   ...prev,
@@ -2226,7 +2223,6 @@ export class RouterCore<
                   isFetching: false,
                   updatedAt: Date.now(),
                   abortController: new AbortController(),
-                  beforeLoadPromise: undefined,
                 }
               })
             }
@@ -2296,10 +2292,7 @@ export class RouterCore<
                     }
                   }
                 }
-                updateMatch(matchId, (prev) => ({
-                  ...prev,
-                  ssr,
-                }))
+                existingMatch.ssr = ssr
               }
 
               if (shouldSkipLoader(matchId)) {
@@ -2321,9 +2314,10 @@ export class RouterCore<
 
               let executeBeforeLoad = true
               const setupPendingTimeout = () => {
+                const match = this.getMatch(matchId)!
                 if (
                   shouldPending &&
-                  this.getMatch(matchId)!.pendingTimeout === undefined
+                  match._nonReactive.pendingTimeout === undefined
                 ) {
                   const pendingTimeout = setTimeout(() => {
                     try {
@@ -2332,22 +2326,19 @@ export class RouterCore<
                       triggerOnReady()
                     } catch {}
                   }, pendingMs)
-                  updateMatch(matchId, (prev) => ({
-                    ...prev,
-                    pendingTimeout,
-                  }))
+                  match._nonReactive.pendingTimeout = pendingTimeout
                 }
               }
               if (
                 // If we are in the middle of a load, either of these will be present
                 // (not to be confused with `loadPromise`, which is always defined)
-                existingMatch.beforeLoadPromise ||
-                existingMatch.loaderPromise
+                existingMatch._nonReactive.beforeLoadPromise ||
+                existingMatch._nonReactive.loaderPromise
               ) {
                 setupPendingTimeout()
 
                 // Wait for the beforeLoad to resolve before we continue
-                await existingMatch.beforeLoadPromise
+                await existingMatch._nonReactive.beforeLoadPromise
                 const match = this.getMatch(matchId)!
                 if (match.status === 'error') {
                   executeBeforeLoad = true
@@ -2361,17 +2352,15 @@ export class RouterCore<
               if (executeBeforeLoad) {
                 // If we are not in the middle of a load OR the previous load failed, start it
                 try {
-                  updateMatch(matchId, (prev) => {
-                    // explicitly capture the previous loadPromise
-                    const prevLoadPromise = prev.loadPromise
-                    return {
-                      ...prev,
-                      loadPromise: createControlledPromise<void>(() => {
-                        prevLoadPromise?.resolve()
-                      }),
-                      beforeLoadPromise: createControlledPromise<void>(),
-                    }
-                  })
+                  const match = this.getMatch(matchId)!
+                  match._nonReactive.beforeLoadPromise =
+                    createControlledPromise<void>()
+                  // explicitly capture the previous loadPromise
+                  const prevLoadPromise = match._nonReactive.loadPromise
+                  match._nonReactive.loadPromise =
+                    createControlledPromise<void>(() => {
+                      prevLoadPromise?.resolve()
+                    })
 
                   const { paramsError, searchError } = this.getMatch(matchId)!
 
@@ -2388,7 +2377,7 @@ export class RouterCore<
                   const abortController = new AbortController()
 
                   const parentMatchContext =
-                    parentMatch?.context ?? this.options.context ?? {}
+                    parentMatch?.context ?? this.options.context ?? undefined
 
                   updateMatch(matchId, (prev) => ({
                     ...prev,
@@ -2453,11 +2442,11 @@ export class RouterCore<
                 }
 
                 updateMatch(matchId, (prev) => {
-                  prev.beforeLoadPromise?.resolve()
+                  prev._nonReactive.beforeLoadPromise?.resolve()
+                  prev._nonReactive.beforeLoadPromise = undefined
 
                   return {
                     ...prev,
-                    beforeLoadPromise: undefined,
                     isFetching: false,
                   }
                 })
@@ -2507,8 +2496,8 @@ export class RouterCore<
 
                   const potentialPendingMinPromise = async () => {
                     const latestMatch = this.getMatch(matchId)!
-                    if (latestMatch.minPendingPromise) {
-                      await latestMatch.minPendingPromise
+                    if (latestMatch._nonReactive.minPendingPromise) {
+                      await latestMatch._nonReactive.minPendingPromise
                     }
                   }
 
@@ -2524,7 +2513,7 @@ export class RouterCore<
                     }
                   }
                   // there is a loaderPromise, so we are in the middle of a load
-                  else if (prevMatch.loaderPromise) {
+                  else if (prevMatch._nonReactive.loaderPromise) {
                     // do not block if we already have stale data we can show
                     // but only if the ongoing load is not a preload since error handling is different for preloads
                     // and we don't want to swallow errors
@@ -2535,7 +2524,7 @@ export class RouterCore<
                     ) {
                       return this.getMatch(matchId)!
                     }
-                    await prevMatch.loaderPromise
+                    await prevMatch._nonReactive.loaderPromise
                     const match = this.getMatch(matchId)!
                     if (match.error) {
                       handleRedirectAndNotFound(match, match.error)
@@ -2592,13 +2581,16 @@ export class RouterCore<
                         ? shouldReloadOption(getLoaderContext())
                         : shouldReloadOption
 
-                    updateMatch(matchId, (prev) => ({
-                      ...prev,
-                      loaderPromise: createControlledPromise<void>(),
-                      preload:
-                        !!preload &&
-                        !this.state.matches.some((d) => d.id === matchId),
-                    }))
+                    updateMatch(matchId, (prev) => {
+                      prev._nonReactive.loaderPromise =
+                        createControlledPromise<void>()
+                      return {
+                        ...prev,
+                        preload:
+                          !!preload &&
+                          !this.state.matches.some((d) => d.id === matchId),
+                      }
+                    })
 
                     const runLoader = async () => {
                       try {
@@ -2682,11 +2674,13 @@ export class RouterCore<
                       } catch (err) {
                         const head = await executeHead()
 
-                        updateMatch(matchId, (prev) => ({
-                          ...prev,
-                          loaderPromise: undefined,
-                          ...head,
-                        }))
+                        updateMatch(matchId, (prev) => {
+                          prev._nonReactive.loaderPromise = undefined
+                          return {
+                            ...prev,
+                            ...head,
+                          }
+                        })
                         handleRedirectAndNotFound(this.getMatch(matchId)!, err)
                       }
                     }
@@ -2703,14 +2697,10 @@ export class RouterCore<
                       ;(async () => {
                         try {
                           await runLoader()
-                          const { loaderPromise, loadPromise } =
-                            this.getMatch(matchId)!
-                          loaderPromise?.resolve()
-                          loadPromise?.resolve()
-                          updateMatch(matchId, (prev) => ({
-                            ...prev,
-                            loaderPromise: undefined,
-                          }))
+                          const match = this.getMatch(matchId)!
+                          match._nonReactive.loaderPromise?.resolve()
+                          match._nonReactive.loadPromise?.resolve()
+                          match._nonReactive.loaderPromise = undefined
                         } catch (err) {
                           if (isRedirect(err)) {
                             await this.navigate(err.options)
@@ -2734,25 +2724,23 @@ export class RouterCore<
                     }
                   }
                   if (!loaderIsRunningAsync) {
-                    const { loaderPromise, loadPromise } =
-                      this.getMatch(matchId)!
-                    loaderPromise?.resolve()
-                    loadPromise?.resolve()
+                    const match = this.getMatch(matchId)!
+                    match._nonReactive.loaderPromise?.resolve()
+                    match._nonReactive.loadPromise?.resolve()
                   }
 
                   updateMatch(matchId, (prev) => {
-                    clearTimeout(prev.pendingTimeout)
+                    clearTimeout(prev._nonReactive.pendingTimeout)
+                    prev._nonReactive.pendingTimeout = undefined
+                    if (!loaderIsRunningAsync)
+                      prev._nonReactive.loaderPromise = undefined
+                    prev._nonReactive.dehydrated = undefined
                     return {
                       ...prev,
                       isFetching: loaderIsRunningAsync
                         ? prev.isFetching
                         : false,
-                      loaderPromise: loaderIsRunningAsync
-                        ? prev.loaderPromise
-                        : undefined,
                       invalid: false,
-                      pendingTimeout: undefined,
-                      _dehydrated: undefined,
                     }
                   })
                   return this.getMatch(matchId)!
@@ -2798,7 +2786,7 @@ export class RouterCore<
           invalid: true,
           ...(opts?.forcePending || d.status === 'error'
             ? ({ status: 'pending', error: undefined } as const)
-            : {}),
+            : undefined),
         }
       }
       return d
@@ -3569,7 +3557,8 @@ function applySearchMiddleware({
             try {
               const validatedSearch = {
                 ...result,
-                ...(validateSearch(route.options.validateSearch, result) ?? {}),
+                ...(validateSearch(route.options.validateSearch, result) ??
+                  undefined),
               }
               return validatedSearch
             } catch {