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: content/blog/2020-08-10-react-v17-rc.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -162,17 +162,17 @@ useEffect(() => {
162
162
163
163
Most effects don't need to delay screen updates, so React runs them asynchronously soon after the update has been reflected on the screen. (For the rare cases where you need an effect to block paint, e.g. to measure and position a tooltip, prefer `useLayoutEffect`.)
164
164
165
-
However, the effect *cleanup*function, when it exists, used to run synchronously in React 16. We've found that, similar to `componentWillUnmount` being synchronous in classes, this is not ideal for larger apps because it slows down large screen transitions (e.g. switching tabs).
165
+
However, when a component is unmounting, effect *cleanup*functions used to run synchronously (similar to `componentWillUnmount` being synchronous in classes). We've found that this is not ideal for larger apps because it slows down large screen transitions (e.g. switching tabs).
166
166
167
-
**In React 17, the effect cleanup function also runs asynchronously -- for example, if the component is unmounting, the cleanup will run _after_ the screen has been updated.**
167
+
**In React 17, the effect cleanup function will always runs asynchronously -- for example, if the component is unmounting, the cleanup will run _after_ the screen has been updated.**
168
168
169
-
This mirrors how the effects themselves run more closely. In the rare cases where you might want to rely on the synchronous execution, you can switch to `useLayoutEffect` instead.
169
+
This mirrors how the effects themselves run more closely. In the rare cases where you might want to rely on the synchronous execution, you can switch to `useLayoutEffect` instead.
170
170
171
171
>Note
172
172
>
173
173
>You might be wondering whether this means that you'll now be unable to fix warnings about `setState` on unmounted components. Don't worry -- React specifically checks for this case, and does *not* fire `setState` warnings in the short gap between unmounting and the cleanup. **So code cancelling requests or intervals can almost always stay the same.**
174
174
175
-
Additionally, React 17 executes the cleanup functions in the same order as the effects, according to their position in the tree. Previously, this order was occasionally different.
175
+
Additionally, React 17 will always execute all effect cleanup functions (for all components) before it runs any new effects. React 16 only guaranteed this ordering for effects within a component.
0 commit comments