You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/blog/2025/10/01/react-19-2.md
+8-10Lines changed: 8 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -41,10 +41,10 @@ You can use Activity as an alternative to conditionally rendering parts of your
41
41
42
42
In React 19.2, Activity supports two modes: `visible` and `hidden`.
43
43
44
-
-`hidden`: hides the children, unmounts effects, and defers all updates until React has nothing left to work on.
44
+
-`hidden`: hides the children, unmounts effects, and defers all updates until React has nothing left to work on.
45
45
-`visible`: shows the children, mounts effects, and allows updates to be processed normally.
46
46
47
-
This means you can pre-render and keep rendering hidden parts of the app without impacting the performance of anything visible on screen.
47
+
This means you can pre-render and keep rendering hidden parts of the app without impacting the performance of anything visible on screen.
48
48
49
49
You can use Activity to render hidden parts of the app that a user is likely to navigate to next, or to save the state of parts the user navigates away from. This helps make navigations quicker by loading data, css, and images in the background, and allows back navigations to maintain state such as input fields.
50
50
@@ -56,9 +56,7 @@ For examples on how to use Activity, check out the [Activity docs](/reference/re
56
56
57
57
### `useEffectEvent` {/*use-effect-event*/}
58
58
59
-
_Note: Please upgrade to `eslint-plugin-react-hooks@6.1.0` when using `useEffectEvent`._
60
-
61
-
One common pattern with `useEffect` is to notify the app code about some kind of "events" in an external system. For example, a chat room may get connected, and you might want to display a notification when that happens:
59
+
One common pattern with `useEffect` is to notify the app code about some kind of "events" in an external system. For example, when a chat room gets connected, and you might want to display a notification:
62
60
63
61
```js {5,11}
64
62
functionChatRoom({ roomId, theme }) {
@@ -75,7 +73,7 @@ function ChatRoom({ roomId, theme }) {
75
73
// ...
76
74
```
77
75
78
-
The problem with the code above is that any values used inside such an "event" will cause the surrounding Effect to re-run when they change. For example, changing the `theme` will cause the chat room to reconnect. This behavior makes sense for values that are related to the Effect logic itself, like `roomId`, but it doesn't make sense for `theme`.
76
+
The problem with the code above is that a change to any values used inside such an "event" will cause the surrounding Effect to re-run. For example, changing the `theme` will cause the chat room to reconnect. This makes sense for values related to the Effect logic itself, like `roomId`, but it doesn't make sense for `theme`.
79
77
80
78
To solve this, most users just disable the lint rule and exclude the dependency. But that can lead to bugs since the linter can no longer help you keep the dependencies up to date if you need to update the Effect later.
81
79
@@ -100,7 +98,7 @@ function ChatRoom({ roomId, theme }) {
100
98
101
99
Similar to DOM events, Effect Events always “see” the latest props and state.
102
100
103
-
Effect Events should _not_ be declared in the dependency array. They can only be declared in the same component or Hook as "their" Effect. These restrictions are verified by the linter.
101
+
**Effect Events should _not_ be declared in the dependency array**. You'll need to upgrade to `eslint-plugin-react-hooks@6.1.0` so that the linter doesn't try to insert them as dependencies. Note that Effect Events can only be declared in the same component or Hook as "their" Effect. These restrictions are verified by the linter.
104
102
105
103
<Note>
106
104
@@ -153,7 +151,7 @@ See the [Component track docs](/reference/dev-tools/react-performance-tracks#com
153
151
154
152
### `resume` {/*resume*/}
155
153
156
-
In 19.2 we're adding a new capability to pre-render part of the app ahead of time, and resume rendering it later.
154
+
In 19.2 we're adding a new capability to pre-render part of the app ahead of time, and resume rendering it later.
157
155
158
156
This feature is called "Partial Pre-rendering", and allows you to pre-render the static parts of your app and serve it from a CDN, and then resume rendering the shell to fill it in with dynamic content later.
159
157
@@ -233,7 +231,7 @@ For more info, see the [`cacheSignal` docs](/reference/react/cacheSignal).
233
231
234
232
### Batching Suspense Boundaries for SSR {/*batching-suspense-boundaries-for-ssr*/}
235
233
236
-
We fixed a behavioral bug where Suspense boundaries would reveal differently depending on if they were rendered on the client or when streaming from server-side rendering.
234
+
We fixed a behavioral bug where Suspense boundaries would reveal differently depending on if they were rendered on the client or when streaming from server-side rendering.
237
235
238
236
Starting in 19.2, React will batch reveals of server-rendered Suspense boundaries for a short time, to allow more content to be revealed together and align with the client-rendered behavior.
239
237
@@ -255,7 +253,7 @@ This fix also prepares apps for supporting `<ViewTransition>` for Suspense durin
255
253
256
254
React uses heuristics to ensure throttling does not impact core web vitals and search ranking.
257
255
258
-
For example, if the total page load time is approaching 2.5s (which is the time considered "good" for [LCP](https://web.dev/articles/lcp)), React will stop batching and reveal content immediately so that the throttling is not the reason to miss the metric.
256
+
For example, if the total page load time is approaching 2.5s (which is the time considered "good" for [LCP](https://web.dev/articles/lcp)), React will stop batching and reveal content immediately so that the throttling is not the reason to miss the metric.
0 commit comments