diff --git a/packages/react-router/lib/components.tsx b/packages/react-router/lib/components.tsx
index adbc243164..60c5a6bee0 100644
--- a/packages/react-router/lib/components.tsx
+++ b/packages/react-router/lib/components.tsx
@@ -371,144 +371,6 @@ export interface RouterProviderProps {
   unstable_transitions?: boolean;
 }
 
-function shallowDiff(a: any, b: any) {
-  if (a === b) {
-    return false;
-  }
-  let aKeys = Object.keys(a);
-  let bKeys = Object.keys(b);
-  if (aKeys.length !== bKeys.length) {
-    return true;
-  }
-  for (let key of aKeys) {
-    if (a[key] !== b[key]) {
-      return true;
-    }
-  }
-  return false;
-}
-
-export function UNSTABLE_TransitionEnabledRouterProvider({
-  router,
-  flushSync: reactDomFlushSyncImpl,
-  unstable_onError,
-}: Omit<RouterProviderProps, "unstable_transitions">): React.ReactElement {
-  let fetcherData = React.useRef<Map<string, any>>(new Map());
-  let [revalidating, startRevalidation] = React.useTransition();
-  let [state, setState] = React.useState(router.state);
-
-  (router as any).__setPendingRerender = (promise: Promise<() => void>) =>
-    startRevalidation(
-      // @ts-expect-error - need react 19 types for this to be async
-      async () => {
-        const rerender = await promise;
-        startRevalidation(() => {
-          rerender();
-        });
-      },
-    );
-
-  let navigator = React.useMemo((): Navigator => {
-    return {
-      createHref: router.createHref,
-      encodeLocation: router.encodeLocation,
-      go: (n) => router.navigate(n),
-      push: (to, state, opts) =>
-        router.navigate(to, {
-          state,
-          preventScrollReset: opts?.preventScrollReset,
-        }),
-      replace: (to, state, opts) =>
-        router.navigate(to, {
-          replace: true,
-          state,
-          preventScrollReset: opts?.preventScrollReset,
-        }),
-    };
-  }, [router]);
-
-  let basename = router.basename || "/";
-
-  let dataRouterContext = React.useMemo(
-    () => ({
-      router,
-      navigator,
-      static: false,
-      basename,
-      unstable_onError,
-    }),
-    [router, navigator, basename, unstable_onError],
-  );
-
-  React.useLayoutEffect(() => {
-    return router.subscribe(
-      (newState, { deletedFetchers, flushSync, viewTransitionOpts }) => {
-        newState.fetchers.forEach((fetcher, key) => {
-          if (fetcher.data !== undefined) {
-            fetcherData.current.set(key, fetcher.data);
-          }
-        });
-        deletedFetchers.forEach((key) => fetcherData.current.delete(key));
-
-        const diff = shallowDiff(state, newState);
-
-        if (!diff) return;
-
-        if (flushSync) {
-          if (reactDomFlushSyncImpl) {
-            reactDomFlushSyncImpl(() => setState(newState));
-          } else {
-            setState(newState);
-          }
-        } else {
-          React.startTransition(() => {
-            setState(newState);
-          });
-        }
-      },
-    );
-  }, [router, reactDomFlushSyncImpl, state]);
-
-  // The fragment and {null} here are important!  We need them to keep React 18's
-  // useId happy when we are server-rendering since we may have a <script> here
-  // containing the hydrated server-side staticContext (from StaticRouterProvider).
-  // useId relies on the component tree structure to generate deterministic id's
-  // so we need to ensure it remains the same on the client even though
-  // we don't need the <script> tag
-  return (
-    <>
-      <DataRouterContext.Provider value={dataRouterContext}>
-        <DataRouterStateContext.Provider
-          value={{
-            ...state,
-            revalidation: revalidating ? "loading" : state.revalidation,
-          }}
-        >
-          <FetchersContext.Provider value={fetcherData.current}>
-            {/* <ViewTransitionContext.Provider value={vtContext}> */}
-            <Router
-              basename={basename}
-              location={state.location}
-              navigationType={state.historyAction}
-              navigator={navigator}
-              unstable_transitions={true}
-            >
-              <MemoizedDataRoutes
-                routes={router.routes}
-                future={router.future}
-                state={state}
-                unstable_onError={unstable_onError}
-              />
-            </Router>
-            {/* </ViewTransitionContext.Provider> */}
-          </FetchersContext.Provider>
-        </DataRouterStateContext.Provider>
-      </DataRouterContext.Provider>
-      {null}
-    </>
-  );
-}
-
 /**
  * Render the UI for the given {@link DataRouter}. This component should
  * typically be at the top of an app's element tree.
@@ -626,7 +488,18 @@ export function RouterProvider({
         } else {
           React.startTransition(() => {
             if (unstable_transitions === true) {
-              setOptimisticState(newState);
+              // @ts-expect-error - Needs React 19 types
+              setOptimisticState((state) => ({
+                ...state,
+                navigation:
+                  newState.navigation.state !== "idle"
+                    ? newState.navigation
+                    : state.navigation,
+                revalidation:
+                  newState.revalidation !== "idle"
+                    ? newState.revalidation
+                    : state.revalidation,
+              }));
             }
             logErrorsAndSetState(newState);
           });
@@ -728,7 +601,11 @@ export function RouterProvider({
         } else {
           React.startTransition(() => {
             if (unstable_transitions === true) {
-              setOptimisticState(newState);
+              setOptimisticState((state: any) => ({
+                ...state,
+                navigation: newState.navigation,
+                revalidation: newState.revalidation,
+              }));
             }
             logErrorsAndSetState(newState);
           });
@@ -783,18 +660,62 @@ export function RouterProvider({
     return {
       createHref: router.createHref,
       encodeLocation: router.encodeLocation,
-      go: (n) => router.navigate(n),
-      push: (to, state, opts) =>
-        router.navigate(to, {
+      go: (n) => {
+        if (unstable_transitions === true) {
+          const resolver = new Deferred<void>();
+          // @ts-expect-error - Needs React 19 types
+          startTransition(() => {
+            return router
+              .navigate(n)
+              .then(resolver.resolve)
+              .catch(resolver.reject);
+          });
+          return resolver.promise;
+        }
+        return router.navigate(n);
+      },
+      push: (to, state, opts) => {
+        if (unstable_transitions === true) {
+          const resolver = new Deferred<void>();
+          // @ts-expect-error - Needs React 19 types
+          startTransition(() => {
+            return router
+              .navigate(to, {
+                state,
+                preventScrollReset: opts?.preventScrollReset,
+              })
+              .then(resolver.resolve, resolver.reject);
+          });
+          return resolver.promise;
+        }
+
+        return router.navigate(to, {
           state,
           preventScrollReset: opts?.preventScrollReset,
-        }),
-      replace: (to, state, opts) =>
-        router.navigate(to, {
+        });
+      },
+      replace: (to, state, opts) => {
+        if (unstable_transitions === true) {
+          const resolver = new Deferred<void>();
+          // @ts-expect-error - Needs React 19 types
+          startTransition(() => {
+            return router
+              .navigate(to, {
+                replace: true,
+                state,
+                preventScrollReset: opts?.preventScrollReset,
+              })
+              .then(resolver.resolve, resolver.reject);
+          });
+          return resolver.promise;
+        }
+
+        return router.navigate(to, {
           replace: true,
           state,
           preventScrollReset: opts?.preventScrollReset,
-        }),
+        });
+      },
     };
   }, [router]);
 
diff --git a/packages/react-router/lib/dom/lib.tsx b/packages/react-router/lib/dom/lib.tsx
index cb7a4f7123..a11ee47ed2 100644
--- a/packages/react-router/lib/dom/lib.tsx
+++ b/packages/react-router/lib/dom/lib.tsx
@@ -2938,7 +2938,7 @@ export function useFetcher<T = any>({
   React.useEffect(() => {
     router.getFetcher(fetcherKey);
     return () => router.deleteFetcher(fetcherKey);
-  }, [router, fetcherKey]);
+  }, [router.getFetcher, router.deleteFetcher, fetcherKey]);
 
   // Fetcher additions
   let load = React.useCallback(
diff --git a/packages/react-router/lib/rsc/browser.tsx b/packages/react-router/lib/rsc/browser.tsx
index 5046e28179..e6a9aa3441 100644
--- a/packages/react-router/lib/rsc/browser.tsx
+++ b/packages/react-router/lib/rsc/browser.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import * as ReactDOM from "react-dom";
 
-import { UNSTABLE_TransitionEnabledRouterProvider as RouterProvider } from "../components";
+import { RouterProvider } from "../components";
 import {
   RSCRouterContext,
   type DataRouteMatch,
@@ -18,6 +18,7 @@ import type {
   RSCRenderPayload,
 } from "./server.rsc";
 import type {
+  AgnosticDataRouteObject,
   DataStrategyFunction,
   DataStrategyFunctionArgs,
   RouterContextProvider,
@@ -136,20 +137,21 @@ export function createCallServer({
       }) as Promise<RSCPayload>;
     });
 
-    (globalVar.__reactRouterDataRouter as any).__setPendingRerender(
-      Promise.resolve(payloadPromise)
+    React.startTransition((): any =>
+      payloadPromise
         .then(async (payload) => {
           if (payload.type === "redirect") {
             if (payload.reload || isExternalLocation(payload.location)) {
               window.location.href = payload.location;
-              return () => {};
+              return;
             }
 
-            return () => {
+            React.startTransition(() => {
               globalVar.__reactRouterDataRouter.navigate(payload.location, {
                 replace: payload.replace,
               });
-            };
+            });
+            return;
           }
 
           if (payload.type !== "action") {
@@ -167,22 +169,23 @@ export function createCallServer({
                 window.location.href = rerender.location;
                 return;
               }
-              return () => {
+              React.startTransition(() => {
                 globalVar.__reactRouterDataRouter.navigate(rerender.location, {
                   replace: rerender.replace,
                 });
-              };
+              });
+              return;
             }
 
-            return () => {
-              let lastMatch: RSCRouteManifest | undefined;
+            React.startTransition(() => {
               for (const match of rerender.matches) {
-                globalVar.__reactRouterDataRouter.patchRoutes(
-                  lastMatch?.id ?? null,
+                (
+                  window as WindowWithRouterGlobals
+                ).__reactRouterDataRouter.patchRoutes(
+                  match.parentId ?? null,
                   [createRouteFromServerManifest(match)],
                   true,
                 );
-                lastMatch = match;
               }
 
               (
@@ -203,10 +206,8 @@ export function createCallServer({
                     : null,
                 },
               );
-            };
+            });
           }
-
-          return () => {};
         })
         .catch(() => {}),
     );
@@ -490,20 +491,22 @@ export function getRSCSingleFetchDataStrategy(
         }
         renderedRoutesById.get(route.id)!.push(route);
       }
-      for (const match of args.matches) {
-        const renderedRoutes = renderedRoutesById.get(match.route.id);
-        if (renderedRoutes) {
-          for (const rendered of renderedRoutes) {
-            (
-              window as WindowWithRouterGlobals
-            ).__reactRouterDataRouter.patchRoutes(
-              rendered.parentId ?? null,
-              [createRouteFromServerManifest(rendered)],
-              true,
-            );
+      React.startTransition(() => {
+        for (const match of args.matches) {
+          const renderedRoutes = renderedRoutesById.get(match.route.id);
+          if (renderedRoutes) {
+            for (const rendered of renderedRoutes) {
+              (
+                window as WindowWithRouterGlobals
+              ).__reactRouterDataRouter.patchRoutes(
+                rendered.parentId ?? null,
+                [createRouteFromServerManifest(rendered)],
+                true,
+              );
+            }
           }
         }
-      }
+      });
       return results;
     });
 }
@@ -633,6 +636,42 @@ export interface RSCHydratedRouterProps {
   getContext?: RouterInit["getContext"];
 }
 
+function cloneRoutes(
+  routes: AgnosticDataRouteObject[] | undefined,
+): AgnosticDataRouteObject[] {
+  if (!routes) return undefined as any;
+  return routes.map((route) => ({
+    ...route,
+    children: cloneRoutes(route.children),
+  })) as any;
+}
+
+function diffRoutes(
+  a: AgnosticDataRouteObject[],
+  b: AgnosticDataRouteObject[],
+): boolean {
+  if (a.length !== b.length) return true;
+  return a.some((route, index) => {
+    if ((route as any).element !== (b[index] as any).element) return true;
+    if ((route as any).errorElement !== (b[index] as any).errorElement)
+      return true;
+    if (
+      (route as any).hydrateFallbackElement !==
+      (b[index] as any).hydrateFallbackElement
+    )
+      return true;
+    if ((route as any).hasErrorBoundary !== (b[index] as any).hasErrorBoundary)
+      return true;
+    if ((route as any).hasLoader !== (b[index] as any).hasLoader) return true;
+    if ((route as any).hasClientLoader !== (b[index] as any).hasClientLoader)
+      return true;
+    if ((route as any).hasAction !== (b[index] as any).hasAction) return true;
+    if ((route as any).hasClientAction !== (b[index] as any).hasClientAction)
+      return true;
+    return diffRoutes(route.children || [], b[index].children || []);
+  });
+}
+
 /**
  * Hydrates a server rendered {@link unstable_RSCPayload} in the browser.
  *
@@ -707,16 +746,32 @@ export function RSCHydratedRouter({
     }
   }, []);
 
-  let [location, setLocation] = React.useState(router.state.location);
+  let [{ routes, state }, setState] = React.useState(() => ({
+    routes: cloneRoutes(router.routes),
+    state: router.state,
+  }));
 
   React.useLayoutEffect(
     () =>
       router.subscribe((newState) => {
-        if (newState.location !== location) {
-          setLocation(newState.location);
-        }
+        React.startTransition(() => {
+          setState({
+            routes: cloneRoutes(router.routes),
+            state: newState,
+          });
+        });
       }),
-    [router, location],
+    [router.subscribe],
+  );
+
+  const transitionEnabledRouter = React.useMemo(
+    () =>
+      ({
+        ...router,
+        state,
+        routes,
+      }) as typeof router,
+    [router, routes, state],
   );
 
   React.useEffect(() => {
@@ -817,9 +872,13 @@ export function RSCHydratedRouter({
 
   return (
     <RSCRouterContext.Provider value={true}>
-      <RSCRouterGlobalErrorBoundary location={location}>
+      <RSCRouterGlobalErrorBoundary location={state.location}>
         <FrameworkContext.Provider value={frameworkContext}>
-          <RouterProvider router={router} flushSync={ReactDOM.flushSync} />
+          <RouterProvider
+            router={transitionEnabledRouter}
+            flushSync={ReactDOM.flushSync}
+            unstable_transitions={true}
+          />
         </FrameworkContext.Provider>
       </RSCRouterGlobalErrorBoundary>
     </RSCRouterContext.Provider>
@@ -1022,11 +1081,14 @@ async function fetchAndApplyManifestPatches(
 
   // Without the `allowElementMutations` flag, this will no-op if the route
   // already exists so we can just call it for all returned patches
-  payload.patches.forEach((p) => {
-    (window as WindowWithRouterGlobals).__reactRouterDataRouter.patchRoutes(
-      p.parentId ?? null,
-      [createRouteFromServerManifest(p)],
-    );
+
+  React.startTransition(() => {
+    payload.patches.forEach((p) => {
+      (window as WindowWithRouterGlobals).__reactRouterDataRouter.patchRoutes(
+        p.parentId ?? null,
+        [createRouteFromServerManifest(p)],
+      );
+    });
   });
 }
 
diff --git a/playground/framework/app/routes/_index.tsx b/playground/framework/app/routes/_index.tsx
index a23689de92..c9e4035a72 100644
--- a/playground/framework/app/routes/_index.tsx
+++ b/playground/framework/app/routes/_index.tsx
@@ -1,6 +1,7 @@
 import type { Route } from "./+types/_index";
 
-export function loader({ params }: Route.LoaderArgs) {
+export async function loader({ params }: Route.LoaderArgs) {
+  await new Promise((resolve) => setTimeout(resolve, 200));
   return { planet: "world", date: new Date(), fn: () => 1 };
 }
 
diff --git a/playground/framework/app/routes/product.tsx b/playground/framework/app/routes/product.tsx
index 101343dad0..6a30cb319e 100644
--- a/playground/framework/app/routes/product.tsx
+++ b/playground/framework/app/routes/product.tsx
@@ -1,3 +1,4 @@
+import { useFetcher } from "react-router";
 import type { Route } from "./+types/product";
 
 export function loader({ params }: Route.LoaderArgs) {
@@ -5,5 +6,15 @@ export function loader({ params }: Route.LoaderArgs) {
 }
 
 export default function Component({ loaderData }: Route.ComponentProps) {
-  return <h1>{loaderData.name}</h1>;
+  const fetcher = useFetcher();
+
+  return (
+    <>
+      <h1>{loaderData.name}</h1>
+      <button onClick={() => fetcher.load("/products/fetcher")}>
+        Load via Fetcher
+      </button>
+      {fetcher.data && <pre>{JSON.stringify(fetcher.data, null, 2)}</pre>}
+    </>
+  );
 }
diff --git a/playground/rsc-vite/package.json b/playground/rsc-vite/package.json
index adb0d6b709..3a0e6e3322 100644
--- a/playground/rsc-vite/package.json
+++ b/playground/rsc-vite/package.json
@@ -24,8 +24,8 @@
     "@mjackson/node-fetch-server": "0.6.1",
     "compression": "^1.8.0",
     "express": "^4.21.2",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "canary",
+    "react-dom": "canary",
     "react-router": "workspace:*"
   }
 }
diff --git a/playground/rsc-vite/src/counter.tsx b/playground/rsc-vite/src/counter.tsx
index 7a5b69a098..28d3903765 100644
--- a/playground/rsc-vite/src/counter.tsx
+++ b/playground/rsc-vite/src/counter.tsx
@@ -7,7 +7,6 @@ export function Counter() {
 
   return (
     <div>
-      <h1>Counter</h1>
       <p>Current count: {count}</p>
       <button type="button" onClick={() => setCount(count + 1)}>
         Increment
diff --git a/playground/rsc-vite/src/entry.browser.tsx b/playground/rsc-vite/src/entry.browser.tsx
index 8e4f850b95..8f04c9db89 100644
--- a/playground/rsc-vite/src/entry.browser.tsx
+++ b/playground/rsc-vite/src/entry.browser.tsx
@@ -33,6 +33,7 @@ createFromReadableStream<RSCPayload>(getRSCStream()).then((payload) => {
         <RSCHydratedRouter
           payload={payload}
           createFromReadableStream={createFromReadableStream}
+          routeDiscovery="eager"
         />
       </StrictMode>,
       {
diff --git a/playground/rsc-vite/src/routes/about/about.client.tsx b/playground/rsc-vite/src/routes/about/about.client.tsx
index e0c7a4079d..3ba59aaa3b 100644
--- a/playground/rsc-vite/src/routes/about/about.client.tsx
+++ b/playground/rsc-vite/src/routes/about/about.client.tsx
@@ -31,13 +31,17 @@ export async function clientLoader({ serverLoader }: ClientLoaderFunctionArgs) {
 
 clientLoader.hydrate = true;
 
+export function HydrateFallback() {
+  return <div>Loading about route loader data...</div>;
+}
+
 export default function AboutRoute() {
   const loaderData = useLoaderData<typeof clientLoader>();
   const actionData = useActionData<typeof clientAction>();
 
   return (
     <div style={{ border: "1px solid black", padding: "10px" }}>
-      <h2>About Route</h2>
+      <p>About Route</p>
       <p>Loader data: {loaderData.message}</p>
       <Counter />
       <Form method="post">
@@ -52,7 +56,7 @@ export function ErrorBoundary() {
   let error = useRouteError();
   return (
     <>
-      <h1>Oooops</h1>
+      <p>Oooops</p>
       {isRouteErrorResponse(error) ? (
         <p>
           {error.status} {error.statusText} {error.data}
diff --git a/playground/rsc-vite/src/routes/about/about.tsx b/playground/rsc-vite/src/routes/about/about.tsx
index 3c5db225b3..8737f3b900 100644
--- a/playground/rsc-vite/src/routes/about/about.tsx
+++ b/playground/rsc-vite/src/routes/about/about.tsx
@@ -6,6 +6,7 @@ export {
   clientLoader,
   clientAction,
   default,
+  HydrateFallback
 } from "./about.client";
 
 export function headers({
diff --git a/playground/rsc-vite/src/routes/home/home.tsx b/playground/rsc-vite/src/routes/home/home.tsx
index ffa9c2b6ce..1c983b1aec 100644
--- a/playground/rsc-vite/src/routes/home/home.tsx
+++ b/playground/rsc-vite/src/routes/home/home.tsx
@@ -6,9 +6,10 @@ import { redirect } from "react-router";
 import type { LoaderFunctionArgs } from "react-router";
 
 import "./home.css";
+import { Square } from "../../square";
 
 export async function loader({ request }: LoaderFunctionArgs) {
-  await new Promise((r) => setTimeout(r, 500));
+  // await new Promise((r) => setTimeout(r, 500));
   return {
     message: `Home route loader ran at ${new Date().toISOString()}`,
     wasRedirected:
@@ -16,17 +17,19 @@ export async function loader({ request }: LoaderFunctionArgs) {
   };
 }
 
-export default function HomeRoute({
+export default async function HomeRoute({
   loaderData: { message, wasRedirected },
 }: {
   loaderData: Awaited<ReturnType<typeof loader>>;
 }) {
+  await new Promise((r) => setTimeout(r, 500));
+
   const logOnServer = async () => {
     "use server";
     await new Promise((r) => setTimeout(r, 500));
     console.log("Running action on server!");
     console.log(
-      `  data to prove that scoped vars work: ${message} and it is now ${new Date().toISOString()}`
+      `  data to prove that scoped vars work: ${message} and it is now ${new Date().toISOString()}`,
     );
     return <div>{new Date().toISOString()}</div>;
   };
@@ -43,8 +46,9 @@ export default function HomeRoute({
 
   return (
     <div className="server-box-home">
-      <h2>Home Route</h2>
+      <p>Home Route</p>
       <p>Loader data: {message}</p>
+      <Square />
       <Counter />
       <HomeForm fn={logOnServer} />
       <RedirectForm fn={redirectOnServer} />
diff --git a/playground/rsc-vite/src/routes/parent-index/parent-index.tsx b/playground/rsc-vite/src/routes/parent-index/parent-index.tsx
index ed3e26fad7..332fcfcfb5 100644
--- a/playground/rsc-vite/src/routes/parent-index/parent-index.tsx
+++ b/playground/rsc-vite/src/routes/parent-index/parent-index.tsx
@@ -12,7 +12,7 @@ export default function ParentIndexRoute({
 }) {
   return (
     <div style={{ border: "1px solid black", padding: "10px" }}>
-      <h3>Parent Index Route</h3>
+      <p>Parent Index Route</p>
       <p>Loader data: {loaderData.message}</p>
     </div>
   );
diff --git a/playground/rsc-vite/src/routes/parent/parent.tsx b/playground/rsc-vite/src/routes/parent/parent.tsx
index 7c932b3507..8c67401a48 100644
--- a/playground/rsc-vite/src/routes/parent/parent.tsx
+++ b/playground/rsc-vite/src/routes/parent/parent.tsx
@@ -1,4 +1,6 @@
 import { Outlet } from "react-router";
+import { Square } from "../../square";
+import { Suspense } from "react";
 
 export function loader() {
   return {
@@ -13,9 +15,12 @@ export default function ParentRoute({
 }) {
   return (
     <div style={{ border: "1px solid black", padding: "10px" }}>
-      <h2>Parent Route</h2>
+      <p>Parent Route</p>
       <p>Loader data: {loaderData.message}</p>
-      <Outlet />
+      <Square />
+      <Suspense fallback={<p>Loading...</p>}>
+        <Outlet />
+      </Suspense>
     </div>
   );
 }
diff --git a/playground/rsc-vite/src/routes/root/root.client.tsx b/playground/rsc-vite/src/routes/root/root.client.tsx
index ae047706b2..ab10c98f72 100644
--- a/playground/rsc-vite/src/routes/root/root.client.tsx
+++ b/playground/rsc-vite/src/routes/root/root.client.tsx
@@ -1,9 +1,11 @@
 "use client";
 
+import { useTransition } from "react";
 import {
   useRouteError,
   useNavigation,
   isRouteErrorResponse,
+  useNavigate,
 } from "react-router";
 
 export function ErrorReporter() {
@@ -16,7 +18,7 @@ export function ErrorReporter() {
   if (isRouteErrorResponse(error)) {
     return (
       <div>
-        <h2>Error Response</h2>
+        <p>Error Response</p>
         <p>Status: {error.status}</p>
         <p>Data: {JSON.stringify(error.data)}</p>
       </div>
@@ -25,7 +27,7 @@ export function ErrorReporter() {
 
   return (
     <div>
-      <h2>Error</h2>
+      <p>Error</p>
       <p>{error instanceof Error ? error.message : String(error)}</p>
     </div>
   );
@@ -33,13 +35,30 @@ export function ErrorReporter() {
 
 export function NavigationState() {
   let navigation = useNavigation();
-  return <p>Navigation state: {navigation.state}</p>;
+  let navigate = useNavigate();
+  let [pending, startTransition] = useTransition();
+  return (
+    <>
+      <p>Navigation state: {navigation.state}</p>
+      <p>Pending: {pending ? "Yes" : "No"}</p>
+      <p>
+        <button onClick={() => startTransition(() => navigate("/"))}>
+          Go Home
+        </button>
+      </p>
+      <p>
+        <button onClick={() => startTransition(() => navigate("/parent"))}>
+          Go Parent
+        </button>
+      </p>
+    </>
+  );
 }
 
 export function ErrorBoundary() {
   return (
     <>
-      <h1>Something went wrong!</h1>
+      <p>Something went wrong!</p>
       <ErrorReporter />
     </>
   );
diff --git a/playground/rsc-vite/src/routes/root/root.tsx b/playground/rsc-vite/src/routes/root/root.tsx
index 7820bc4ba7..2dffab4ec2 100644
--- a/playground/rsc-vite/src/routes/root/root.tsx
+++ b/playground/rsc-vite/src/routes/root/root.tsx
@@ -4,6 +4,7 @@ import { type MiddlewareFunction } from "react-router";
 import { Counter } from "../../counter";
 import { ErrorReporter, NavigationState } from "./root.client";
 import "./root.css";
+import { Suspense } from "react";
 
 export { shouldRevalidate } from "./root.client";
 
@@ -35,7 +36,7 @@ export default function RootRoute({
 }) {
   return (
     <div style={{ border: "1px solid black", padding: "10px" }}>
-      <h1>Root Route</h1>
+      <p>Root Route</p>
       <p>Loader data: {loaderData.message}</p>
       {loaderData.counter}
       <Outlet />
@@ -44,13 +45,13 @@ export default function RootRoute({
 }
 
 export function HydrateFallback() {
-  return <h1>Loading...</h1>;
+  return <p>Loading...</p>;
 }
 
 export function ErrorBoundary() {
   return (
     <>
-      <h1>Root - Something went wrong!</h1>
+      <p>Root - Something went wrong!</p>
       <ErrorReporter />
     </>
   );
@@ -78,10 +79,10 @@ export function Layout({ children }: { children: React.ReactNode }) {
             {" | "}
             <Link to="/redirect">Redirect</Link>
           </header>
-          <h1>Root Layout</h1>
+          <p>Root Layout</p>
           <NavigationState />
           <Counter />
-          {children}
+          <Suspense>{children}</Suspense>
         </div>
         <ScrollRestoration />
       </body>
diff --git a/playground/rsc-vite/src/square.tsx b/playground/rsc-vite/src/square.tsx
new file mode 100644
index 0000000000..7041f15b67
--- /dev/null
+++ b/playground/rsc-vite/src/square.tsx
@@ -0,0 +1,30 @@
+import { ViewTransition } from "react";
+
+export function Square() {
+  const top = Math.random() * 100;
+  const left = Math.random() * 100;
+
+  return (
+    <div
+      style={{
+        position: "relative",
+        height: "200px",
+        width: "100%",
+      }}
+    >
+      <ViewTransition name="red-square">
+        <div
+          style={{
+            position: "absolute",
+            top: `${top}%`,
+            left: `${left}%`,
+            height: "50px",
+            width: "50px",
+            backgroundColor: "red",
+            transform: "translate(-50%, -50%)",
+          }}
+        />
+      </ViewTransition>
+    </div>
+  );
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 17c5a53a5f..d528ae3c70 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -134,7 +134,7 @@ importers:
         version: 2.4.2
       react-server-dom-parcel:
         specifier: ^19.0.0
-        version: 19.1.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+        version: 19.1.0(react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113))(react@19.3.0-canary-93fc5740-20251113)
       remark-gfm:
         specifier: ^3.0.1
         version: 3.0.1
@@ -598,7 +598,7 @@ importers:
         version: 3.0.1(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1))
       vite-tsconfig-paths:
         specifier: ^4.2.1
-        version: 4.3.2(typescript@5.4.5)(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1))
+        version: 4.3.2(typescript@5.4.5)(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1)(terser@5.15.0))
 
   integration/helpers/vite-6-template:
     dependencies:
@@ -1161,7 +1161,7 @@ importers:
         version: 7.7.0
       '@vitejs/plugin-rsc':
         specifier: 0.4.30
-        version: 0.4.30(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite@6.2.5(@types/node@20.11.30)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
+        version: 0.4.30(react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113))(react@19.3.0-canary-93fc5740-20251113)(vite@6.2.5(@types/node@20.11.30)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
       esbuild-register:
         specifier: ^3.6.0
         version: 3.6.0(esbuild@0.25.4)
@@ -1576,7 +1576,7 @@ importers:
         version: 5.1.3(@types/node@22.14.0)(lightningcss@1.30.1)(terser@5.15.0)
       vite-tsconfig-paths:
         specifier: ^4.2.1
-        version: 4.3.2(typescript@5.4.5)(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1))
+        version: 4.3.2(typescript@5.4.5)(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1)(terser@5.15.0))
 
   playground/framework-vite-7-beta:
     dependencies:
@@ -1819,11 +1819,11 @@ importers:
         specifier: ^4.21.2
         version: 4.21.2
       react:
-        specifier: ^19.0.0
-        version: 19.1.0
+        specifier: canary
+        version: 19.3.0-canary-93fc5740-20251113
       react-dom:
-        specifier: ^19.0.0
-        version: 19.1.0(react@19.1.0)
+        specifier: canary
+        version: 19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113)
       react-router:
         specifier: workspace:*
         version: link:../../packages/react-router
@@ -1845,7 +1845,7 @@ importers:
         version: 4.5.2(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
       '@vitejs/plugin-rsc':
         specifier: 0.4.30
-        version: 0.4.30(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
+        version: 0.4.30(react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113))(react@19.3.0-canary-93fc5740-20251113)(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
       cross-env:
         specifier: ^7.0.3
         version: 7.0.3
@@ -8542,6 +8542,11 @@ packages:
     peerDependencies:
       react: ^19.1.0
 
+  react-dom@19.3.0-canary-93fc5740-20251113:
+    resolution: {integrity: sha512-7e727XldLZzQFADqy8dRhKJZLB+GquIIsIJSaibfQg5WFRZIbv9UQS23zEW9V1ZAKHqP4aNSUIU4A3GOlUAU1g==}
+    peerDependencies:
+      react: 19.3.0-canary-93fc5740-20251113
+
   react-is@19.1.0:
     resolution: {integrity: sha512-Oe56aUPnkHyyDxxkvqtd7KkdQP5uIUfHxd5XTb3wE9d/kRnZLmKbDB0GWk919tdQ+mxxPtG6EAs6RMT6i1qtHg==}
 
@@ -8573,6 +8578,10 @@ packages:
     resolution: {integrity: sha512-FS+XFBNvn3GTAWq26joslQgWNoFu08F4kl0J4CgdNKADkdSGXQyTCnKteIAJy96Br6YbpEU1LSzV5dYtjMkMDg==}
     engines: {node: '>=0.10.0'}
 
+  react@19.3.0-canary-93fc5740-20251113:
+    resolution: {integrity: sha512-25JV++u1St/6AqWZW0gq+SXa9jlfFvg3koO/sT0kakukbTAnddtMMW+YeDqdYSOQbZlmzXiPpcFPSy68qm84pw==}
+    engines: {node: '>=0.10.0'}
+
   read-cache@1.0.0:
     resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
 
@@ -8907,6 +8916,9 @@ packages:
   scheduler@0.26.0:
     resolution: {integrity: sha512-NlHwttCI/l5gCPR3D1nNXtWABUmBwvZpEQiD4IXSbIDq8BzLIK/7Ir5gTFSGZDUu37K5cMNp0hFtzO38sC7gWA==}
 
+  scheduler@0.28.0-canary-93fc5740-20251113:
+    resolution: {integrity: sha512-NTTbe6wNqtff+RdwnhFzcLXDAHDMcq9d0cJwKz/aVuJHAyBEMmkaQLQCGimF3UhaOeQPAYzFFYO8/cKy3AIc6A==}
+
   semver@5.7.1:
     resolution: {integrity: sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==}
     hasBin: true
@@ -13782,7 +13794,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@vitejs/plugin-rsc@0.4.30(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite@6.2.5(@types/node@20.11.30)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))':
+  '@vitejs/plugin-rsc@0.4.30(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))':
     dependencies:
       '@remix-run/node-fetch-server': 0.8.1
       es-module-lexer: 1.7.0
@@ -13792,18 +13804,31 @@ snapshots:
       react: 19.1.0
       react-dom: 19.1.0(react@19.1.0)
       turbo-stream: 3.1.0
+      vite: 6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0)
+      vitefu: 1.1.1(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
+
+  '@vitejs/plugin-rsc@0.4.30(react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113))(react@19.3.0-canary-93fc5740-20251113)(vite@6.2.5(@types/node@20.11.30)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))':
+    dependencies:
+      '@remix-run/node-fetch-server': 0.8.1
+      es-module-lexer: 1.7.0
+      estree-walker: 3.0.3
+      magic-string: 0.30.18
+      periscopic: 4.0.2
+      react: 19.3.0-canary-93fc5740-20251113
+      react-dom: 19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113)
+      turbo-stream: 3.1.0
       vite: 6.2.5(@types/node@20.11.30)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0)
       vitefu: 1.1.1(vite@6.2.5(@types/node@20.11.30)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
 
-  '@vitejs/plugin-rsc@0.4.30(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))':
+  '@vitejs/plugin-rsc@0.4.30(react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113))(react@19.3.0-canary-93fc5740-20251113)(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))':
     dependencies:
       '@remix-run/node-fetch-server': 0.8.1
       es-module-lexer: 1.7.0
       estree-walker: 3.0.3
       magic-string: 0.30.18
       periscopic: 4.0.2
-      react: 19.1.0
-      react-dom: 19.1.0(react@19.1.0)
+      react: 19.3.0-canary-93fc5740-20251113
+      react-dom: 19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113)
       turbo-stream: 3.1.0
       vite: 6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0)
       vitefu: 1.1.1(vite@6.2.5(@types/node@22.14.0)(jiti@2.4.2)(lightningcss@1.30.1)(tsx@4.19.3)(yaml@2.8.0))
@@ -18168,6 +18193,11 @@ snapshots:
       react: 19.1.0
       scheduler: 0.26.0
 
+  react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113):
+    dependencies:
+      react: 19.3.0-canary-93fc5740-20251113
+      scheduler: 0.28.0-canary-93fc5740-20251113
+
   react-is@19.1.0: {}
 
   react-refresh@0.14.2: {}
@@ -18181,6 +18211,11 @@ snapshots:
       react: 19.1.0
       react-dom: 19.1.0(react@19.1.0)
 
+  react-server-dom-parcel@19.1.0(react-dom@19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113))(react@19.3.0-canary-93fc5740-20251113):
+    dependencies:
+      react: 19.3.0-canary-93fc5740-20251113
+      react-dom: 19.3.0-canary-93fc5740-20251113(react@19.3.0-canary-93fc5740-20251113)
+
   react-test-renderer@19.1.0(react@19.1.0):
     dependencies:
       react: 19.1.0
@@ -18189,6 +18224,8 @@ snapshots:
 
   react@19.1.0: {}
 
+  react@19.3.0-canary-93fc5740-20251113: {}
+
   read-cache@1.0.0:
     dependencies:
       pify: 2.3.0
@@ -18553,6 +18590,8 @@ snapshots:
 
   scheduler@0.26.0: {}
 
+  scheduler@0.28.0-canary-93fc5740-20251113: {}
+
   semver@5.7.1: {}
 
   semver@6.3.1: {}
@@ -19550,7 +19589,7 @@ snapshots:
       - supports-color
       - typescript
 
-  vite-tsconfig-paths@4.3.2(typescript@5.4.5)(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1)):
+  vite-tsconfig-paths@4.3.2(typescript@5.4.5)(vite@5.1.3(@types/node@22.14.0)(lightningcss@1.30.1)(terser@5.15.0)):
     dependencies:
       debug: 4.4.1
       globrex: 0.1.2