Why does an effect run twice in development or loop forever?
Try code in the playgroundUnderstand the concept
React Strict Mode performs an extra development-only setup and cleanup cycle for effects to reveal missing cleanup. An infinite effect loop is a different issue, usually caused by updating state that keeps changing an effect dependency. Understanding the trigger helps fix the design rather than masking the behavior.
Important ideas
- Strict Mode runs an extra setup-and-cleanup cycle in development to expose bugs.
- A loop often means the effect changes state that changes its own dependencies.
- Fix the dependency or synchronization design; do not simply remove dependencies.
Reference: React useEffect.
- An object or function created during every render has a new identity and can retrigger an effect that depends on it.
Can you explain it without the notes?
Why does an effect run twice in development or loop forever?
Use your own words. Explain an example and one limitation before checking the explanation.
Check your explanation
React Strict Mode performs an extra development-only setup and cleanup cycle for effects to reveal missing cleanup. An infinite effect loop is a different issue, usually caused by updating state that keeps changing an effect dependency. Understanding the trigger helps fix the design rather than masking the behavior.
Turn this concept into a clear answer.
- Do not claim production always runs every effect twice, and do not remove required dependencies just to silence a loop.
Adapted from 06_REACT_NEXTJS.md · “Why does an effect run twice in development or loop forever?”. Examples are study fragments; framework behavior can depend on your version.