docs: add Activity option to preserving state for removed components

src/content/learn/preserving-and-resetting-state.md

@@ -1228,6 +1228,7 @@ textarea {
 In a real chat app, you'd probably want to recover the input state when the user selects the previous recipient again. There are a few ways to keep the state "alive" for a component that's no longer visible:
 
 - You could render _all_ chats instead of just the current one, but hide all the others with CSS. The chats would not get removed from the tree, so their local state would be preserved. This solution works great for simple UIs. But it can get very slow if the hidden trees are large and contain a lot of DOM nodes.
+- You could wrap chats in [`<Activity>`](/reference/react/Activity) and set `mode="hidden"` for inactive ones. Like hiding with CSS, the hidden components preserve their state and DOM nodes. However, unlike CSS hiding, React cleans up Effects for hidden components and deprioritizes background updates.
 - You could [lift the state up](/learn/sharing-state-between-components) and hold the pending message for each recipient in the parent component. This way, when the child components get removed, it doesn't matter, because it's the parent that keeps the important information. This is the most common solution.
 - You might also use a different source in addition to React state. For example, you probably want a message draft to persist even if the user accidentally closes the page. To implement this, you could have the `Chat` component initialize its state by reading from the [`localStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage), and save the drafts there too.