Skip to content

Commit 4c26649

Browse files
committed
Add note on creating router outside of the react tree
1 parent 4e12473 commit 4c26649

File tree

2 files changed

+12
-0
lines changed

2 files changed

+12
-0
lines changed

docs/routers/create-browser-router.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,10 @@ This is the recommended router for all React Router web projects. It uses the [D
99

1010
It also enables the v6.4 data APIs like [loaders][loader], [actions][action], [fetchers][fetcher] and more.
1111

12+
<docs-info>
13+
Due to the decoupling of fetching and rendering in the design of the data APIs, you should create your router outside of the React tree with a statically defined set of routes. For more information on this design, please see the [Remixing React Router][remixing-react-router] blog post and the W[When to Fetch][when-to-fetch] conference talk.
14+
</docs-info>
15+
1216
```tsx lines=[4,11-24]
1317
import * as React from "react";
1418
import * as ReactDOM from "react-dom";
@@ -125,3 +129,5 @@ Useful for environments like browser devtool plugins or testing to use a differe
125129
[routes]: ../components/routes
126130
[historyapi]: https://developer.mozilla.org/en-US/docs/Web/API/History
127131
[api-development-strategy]: ../guides/api-development-strategy
132+
[remixing-react-router]: https://remix.run/blog/remixing-react-router
133+
[when-to-fetch]: https://www.youtube.com/watch?v=95B8mnhzoCM

docs/routers/router-provider.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,10 @@ interface RouterProviderProps {
2424

2525
All [data router][picking-a-router] objects are passed to this component to render your app and enable the rest of the data APIs.
2626

27+
<docs-info>
28+
Due to the decoupling of fetching and rendering in the design of the data APIs, you should create your router outside of the React tree with a statically defined set of routes. For more information on this design, please see the [Remixing React Router][remixing-react-router] blog post and the W[When to Fetch][when-to-fetch] conference talk.
29+
</docs-info>
30+
2731
```jsx lines=[24]
2832
import {
2933
createBrowserRouter,
@@ -83,3 +87,5 @@ function App() {
8387

8488
[picking-a-router]: ./picking-a-router
8589
[api-development-strategy]: ../guides/api-development-strategy
90+
[remixing-react-router]: https://remix.run/blog/remixing-react-router
91+
[when-to-fetch]: https://www.youtube.com/watch?v=95B8mnhzoCM

0 commit comments

Comments
 (0)