Skip to content

Commit a1fbcf8

Browse files
JSerZANPsophiebits
andauthored
Update useEffect.md - The explanation on the timing of useEffect() callback doesn't seem to be accurate. (#6207)
* Update useEffect.md * Update src/content/reference/react/useEffect.md --------- Co-authored-by: Sophie Alpert <git@sophiebits.com>
1 parent 828e30a commit a1fbcf8

File tree

1 file changed

+1
-1
lines changed

1 file changed

+1
-1
lines changed

src/content/reference/react/useEffect.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ function ChatRoom({ roomId }) {
6262
6363
* If some of your dependencies are objects or functions defined inside the component, there is a risk that they will **cause the Effect to re-run more often than needed.** To fix this, remove unnecessary [object](#removing-unnecessary-object-dependencies) and [function](#removing-unnecessary-function-dependencies) dependencies. You can also [extract state updates](#updating-state-based-on-previous-state-from-an-effect) and [non-reactive logic](#reading-the-latest-props-and-state-from-an-effect) outside of your Effect.
6464
65-
* If your Effect wasn't caused by an interaction (like a click), React will let the browser **paint the updated screen first before running your Effect.** If your Effect is doing something visual (for example, positioning a tooltip), and the delay is noticeable (for example, it flickers), replace `useEffect` with [`useLayoutEffect`.](/reference/react/useLayoutEffect)
65+
* If your Effect wasn't caused by an interaction (like a click), React will generally let the browser **paint the updated screen first before running your Effect.** If your Effect is doing something visual (for example, positioning a tooltip), and the delay is noticeable (for example, it flickers), replace `useEffect` with [`useLayoutEffect`.](/reference/react/useLayoutEffect)
6666
6767
* Even if your Effect was caused by an interaction (like a click), **the browser may repaint the screen before processing the state updates inside your Effect.** Usually, that's what you want. However, if you must block the browser from repainting the screen, you need to replace `useEffect` with [`useLayoutEffect`.](/reference/react/useLayoutEffect)
6868

0 commit comments

Comments
 (0)