Skip to content

Commit 558c1c7

Browse files
committed
docs: route module updates
1 parent 7819e04 commit 558c1c7

File tree

9 files changed

+415
-491
lines changed

9 files changed

+415
-491
lines changed

docs/explanation/hydration.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
title: Hydration
3+
hidden: true
4+
---
5+
6+
There are a few nuances worth noting around the behavior of `HydrateFallback`:
7+
8+
- It is only relevant on initial document request and hydration, and will not be rendered on any subsequent client-side navigations
9+
- It is only relevant when you are also setting [`clientLoader.hydrate=true`][hydrate-true] on a given route
10+
- It is also relevant if you do have a `clientLoader` without a server `loader`, as this implies `clientLoader.hydrate=true` since there is otherwise no loader data at all to return from `useLoaderData`
11+
- Even if you do not specify a `HydrateFallback` in this case, React Router will not render your route component and will bubble up to any ancestor `HydrateFallback` component
12+
- This is to ensure that `useLoaderData` remains "happy-path"
13+
- Without a server `loader`, `useLoaderData` would return `undefined` in any rendered route components
14+
- You cannot render an `<Outlet/>` in a `HydrateFallback` because children routes can't be guaranteed to operate correctly since their ancestor loader data may not yet be available if they are running `clientLoader` functions on hydration (i.e., use cases such as `useRouteLoaderData()` or `useMatches()`)

0 commit comments

Comments
 (0)