Skip to content

Commit b14dd5d

Browse files
committed
Tidy
1 parent ca9edf6 commit b14dd5d

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

src/content/reference/react/Activity.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -907,7 +907,7 @@ function Page() {
907907
}
908908
```
909909

910-
During hydration, React will leave the visible Activity boundary unmounted while hydrating the rest of the page, improving the performance of higher-priority content. Once the rest of the page has fetched its code and data and been rendered, React will move on to mount any remaining visible Activity boundaries.
910+
During hydration, React will leave the visible Activity boundary unmounted while hydrating the rest of the page, improving the performance of higher-priority content. Once the high-priority content has fetched its code and data, and been rendered to the page, React will move on to mount any remaining visible Activity boundaries.
911911

912912
This feature is called Selective Hydration, and it's an under-the-hood optimization of React that's integrated with Suspense. You can read [an architectural overview](https://github.com/reactwg/react-18/discussions/37) and watch [a technical talk](https://www.youtube.com/watch?v=pj5N-Khihgc) to learn more.
913913

@@ -1161,7 +1161,7 @@ export default function VideoTab() {
11611161

11621162
We call `useLayoutEffect` instead of `useEffect` because conceptually the clean-up code is tied to the component's UI being visually hidden. If we used a regular effect, the code could be delayed by (say) a re-suspending Suspense boundary or a View Transition.
11631163

1164-
Let's see the new behavior:
1164+
Let's see the new behavior. Try playing the video, switching to the Home tab, then back to the Video tab:
11651165

11661166
<Sandpack>
11671167

@@ -1278,7 +1278,7 @@ video { width: 300px; margin-top: 10px; aspect-ratio: 16/9; }
12781278

12791279
</Sandpack>
12801280

1281-
It's working great! Our cleanup function ensures that the video stops playing if it's ever hidden by an Activity boundary, and even better, because the `<video>` tag is never destroyed, the timecode is preserved, and the video itself doesn't need to be initialized or downloaded again when the user switches back to watch it.
1281+
It works great! Our cleanup function ensures that the video stops playing if it's ever hidden by an Activity boundary, and even better, because the `<video>` tag is never destroyed, the timecode is preserved, and the video itself doesn't need to be initialized or downloaded again when the user switches back to watch it.
12821282

12831283
This is a great example of using Activity to preserve ephemeral DOM state for parts of the UI that become hidden, but the user is likely to interact with again soon.
12841284

0 commit comments

Comments
 (0)