Skip to content

Commit 0f5df0c

Browse files
authored
Apply suggestions from code review
1 parent 05a5bc1 commit 0f5df0c

1 file changed

Lines changed: 5 additions & 5 deletions

File tree

docs/source/performance/server-side-rendering.mdx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -129,9 +129,9 @@ It's important to create an _entirely new instance_ of Apollo Client for each re
129129

130130
### Executing queries with `prerenderStatic`
131131

132-
You can instruct Apollo Client to execute all of the queries executed by the `useQuery` or `useSuspenseQuery` hooks in the React tree's components with the `prerenderStatic` function.
132+
You can instruct Apollo Client to execute all of the queries executed by the `useQuery` or the suspenseful query hooks (like `useSuspenseQuery` and `useBackgroundQuery`) in the React tree's components with the `prerenderStatic` function.
133133

134-
This function rerenders your React tree until no more network requests are made. When you use suspenseful hooks (like `useSuspenseQuery`) with a suspense-ready rendering function, the tree is rendered once and suspends while network requests are executed. When you use non-suspenseful hooks (like `useQuery`), this function renders all components, waits for all requests to finish, and then re-renders the tree until no more requests are made.
134+
This function rerenders your React tree until no more network requests are made. When you use suspenseful hooks with a suspense-ready rendering function, the tree is rendered once and suspends while network requests are executed. When you use non-suspenseful hooks (like `useQuery`), this function renders all components, waits for all requests to finish, and then re-renders the tree until no more requests are made.
135135

136136
The function returns a `Promise` that resolves when all result data is ready in the Apollo Client cache and the final render is complete.
137137

@@ -141,7 +141,7 @@ The function returns a `Promise` that resolves when all result data is ready in
141141

142142
- **`prerender`** from `react-dom/static` - Recommended for Deno or modern edge runtimes with Web Streams. Supports React Suspense.
143143
- **`prerenderToNodeStream`** from `react-dom/static` - Recommended for Node.js. Supports React Suspense.
144-
- **`renderToString`** from `react-dom/server` - Legacy API without Suspense support. Won't work with `useSuspenseQuery`.
144+
- **`renderToString`** from `react-dom/server` - Legacy API without Suspense support. Won't work with suspenseful hooks.
145145
- **`renderToStaticMarkup`** from `react-dom/server` - Legacy API without Suspense support. Slightly faster than `renderToString`, but the result cannot be hydrated.
146146

147147
The following code replaces the `TODO` comment within the `app.use` call in the example above:
@@ -222,7 +222,7 @@ In the end, it's a tradeoff between more work on the server and a potential dela
222222
</Note>
223223

224224
<Tip>
225-
If you are only using suspenseful hooks like `useSuspenseQuery` and no `useQuery` hooks, is also possible to use the [@apollo/client-react-streaming](https://github.com/apollographql/apollo-client-integrations/tree/main/packages/client-react-streaming) package to stream data dynamically while it is fetching, without requiring a first render pass with `prerenderStatic`.
225+
If you are only using suspenseful hooks (like `useSuspenseQuery` or `useBackgroundQuery`) and no `useQuery` hooks, is also possible to use the [@apollo/client-react-streaming](https://github.com/apollographql/apollo-client-integrations/tree/main/packages/client-react-streaming) package to stream data dynamically while it is fetching, without requiring a first render pass with `prerenderStatic`.
226226
You can find an example application that uses this approach in the [integration tests for that package](https://github.com/apollographql/apollo-client-integrations/tree/main/integration-test/vite-streaming).
227227
</Tip>
228228

@@ -296,7 +296,7 @@ const { diagnostics } = await prerenderStatic({
296296
});
297297

298298
console.log(`Rendered ${diagnostics.renderCount} times`);
299-
// If renderCount is high, consider using fragment colocation or useSuspenseQuery
299+
// If renderCount is high, consider using fragment colocation
300300
```
301301

302302
**Timeout support**

0 commit comments

Comments
 (0)