docs: add caveats about memory to ssr.md (#3290)

* docs: add caveats about memory to ssr.md

* revert style changes

* Update docs/src/pages/guides/ssr.md

Co-authored-by: Dominik Dorfmeister <[email protected]>

* Update docs/src/pages/guides/ssr.md

Co-authored-by: Dominik Dorfmeister <[email protected]>

Co-authored-by: Dominik Dorfmeister <[email protected]>

Author: meskill

docs/src/pages/guides/ssr.md

@@ -126,6 +126,7 @@ This guide is at-best, a high level overview of how SSR with React Query should
 - Dehydrate the client
 - Render your app with the client provider and also **using the dehydrated state. This is extremely important! You must render both server and client using the same dehydrated state to ensure hydration on the client produces the exact same markup as the server.**
 - Serialize and embed the dehydrated cache to be sent to the client with the HTML
+- Clear the React Query caches after the dehydrated state has been sent by calling [`queryClient.clear()`](../reference/QueryClient#queryclientclear)
 
 > SECURITY NOTE: Serializing data with `JSON.stringify` can put you at risk for XSS-vulnerabilities, [this blog post explains why and how to solve it](https://medium.com/node-security/the-most-common-xss-vulnerability-in-react-js-applications-2bdffbcc1fa0)
 
@@ -155,6 +156,8 @@ function handleRequest (req, res) {
       </body>
     </html>
   `)
+
+  queryClient.clear()
 }
 ```
 
@@ -196,3 +199,11 @@ A query is considered stale depending on when it was `dataUpdatedAt`. A caveat h
 Because `staleTime` defaults to `0`, queries will be refetched in the background on page load by default. You might want to use a higher `staleTime` to avoid this double fetching, especially if you don't cache your markup.
 
 This refetching of stale queries is a perfect match when caching markup in a CDN! You can set the cache time of the page itself decently high to avoid having to re-render pages on the server, but configure the `staleTime` of the queries lower to make sure data is refetched in the background as soon as a user visits the page. Maybe you want to cache the pages for a week, but refetch the data automatically on page load if it's older than a day?
+
+### High memory consumption on server
+
+In case you are creating the `QueryClient` for every request, React Query creates the isolated cache for this client, which is preserved in memory for the `cacheTime` period (which defaults to 5 minutes). That may lead to high memory consumption on server in case of high number of requests during that period.
+
+To clear the cache after it is not needed and to lower memory consumption, you can add a call to [`queryClient.clear()`](../reference/QueryClient#queryclientclear) after the request is handled and dehydrated state has been sent to the client.
+
+Alternatively, you can set a smaller `cacheTime`.