# Error: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.

- **ID:** `react/state-update-in-effect-without-deps`
- **Domain:** react
- **Category:** runtime_error
- **Verification:** ai_generated
- **Fix Rate:** 88%

## Root Cause

A useEffect with a state update either lacks a dependency array (runs after every render) or has a dependency that mutates on every render (e.g., a new object/function), causing an infinite loop.

## Version Compatibility

| Version | Status | Introduced | Deprecated |
|---------|--------|------------|------------|
| React 18.2.0 | active | — | — |
| React 17.0.2 | active | — | — |

## Workarounds

1. **Provide a proper dependency array with stable values. If the state update depends on previous state, use the functional update form: setState(prev => prev + 1).** (95% success)
   ```
   Provide a proper dependency array with stable values. If the state update depends on previous state, use the functional update form: setState(prev => prev + 1).
   ```
2. **If the effect needs to react to a changing value, ensure that value is memoized with useMemo or useCallback to maintain referential stability.** (90% success)
   ```
   If the effect needs to react to a changing value, ensure that value is memoized with useMemo or useCallback to maintain referential stability.
   ```

## Dead Ends

- **** — If the effect needs to react to prop or state changes, an empty array makes it run only once, potentially missing updates and causing stale data. (50% fail)
- **** — Inline functions/objects are new references each render, so the effect runs every time, defeating the purpose. (85% fail)