{"record":{"id":"59cb9ef4921e11f2","repo":"facebook/react","slug":"185","errorCode":"185","errorMessage":"Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.","messagePattern":"Maximum update depth exceeded\\. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate\\. React limits the number of nested updates to prevent infinite loops\\.","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"packages/react-reconciler/src/ReactFiberWorkLoop.js","lineNumber":5256,"sourceCode":"          (executionContext & RenderContext) !== NoContext\n        ) {\n          // This loop was identified only because of the instrumentation gated with enableInfiniteRenderLoopDetection,\n          // warn instead of throwing, unless enableInfiniteRenderLoopDetectionForceThrow.\n          if (enableInfiniteRenderLoopDetectionForceThrow) {\n            throwForcedInfiniteRenderLoopError(\n              workInProgressRoot,\n              workInProgressRootRenderLanes,\n            );\n          } else if (__DEV__) {\n            console.error(\n              'Maximum update depth exceeded. This could be an infinite loop. This can happen when a component ' +\n                'repeatedly calls setState during render phase or inside useLayoutEffect, ' +\n                'causing infinite render loop. React limits the number of nested updates to ' +\n                'prevent infinite loops.',\n            );\n          }\n        } else {\n          throw new Error(\n            'Maximum update depth exceeded. This can happen when a component ' +\n              'repeatedly calls setState inside componentWillUpdate or ' +\n              'componentDidUpdate. React limits the number of nested updates to ' +\n              'prevent infinite loops.',\n          );\n        }\n      } else if (updateKind === NESTED_UPDATE_PHASE_SPAWN) {\n        if (enableInfiniteRenderLoopDetectionForceThrow) {\n          throwForcedInfiniteRenderLoopError(\n            workInProgressRoot,\n            workInProgressRootRenderLanes,\n          );\n        } else if (__DEV__) {\n          console.error(\n            'Maximum update depth exceeded. This could be an infinite loop. This can happen when a component ' +\n              'repeatedly calls setState during render phase or inside useLayoutEffect, ' +\n              'causing infinite render loop. React limits the number of nested updates to ' +\n              'prevent infinite loops.',","sourceCodeStart":5238,"sourceCodeEnd":5274,"githubUrl":"https://github.com/facebook/react/blob/eafeac097ba51e1eab809c07102126bd5f8e5425/packages/react-reconciler/src/ReactFiberWorkLoop.js#L5238-L5274","documentation":"The nested-update guard: when nestedUpdateCount exceeds NESTED_UPDATE_LIMIT (50) and the tracked update phase attributes the chain to commit-phase lifecycles (error code 185), React throws this variant targeting the classic componentDidUpdate -> setState -> componentDidUpdate loop that never converges. The limit exists because an unbounded loop would freeze the page.","triggerScenarios":"A class component calling setState (or forceUpdate) inside componentDidUpdate or componentWillUpdate without a terminating condition, so each commit schedules another commit until the 50-update cap trips.","commonSituations":"componentDidUpdate syncing props to state unconditionally; two components updating each other in lifecycle ping-pong; parent passing a new object literal each render while the child re-syncs state from props in componentDidUpdate.","solutions":["Wrap the componentDidUpdate setState in an equality check against prevProps/current state so it only fires on real changes","Replace the prop-to-state sync with getDerivedStateFromProps, its designed replacement, or derive during render","Memoize the parent's inputs (or use shouldComponentUpdate/PureComponent/memo) so identical data does not trigger the child's lifecycle","Lift the shared state to the closest common parent so one update replaces the loop"],"exampleFix":"// before\ncomponentDidUpdate(prevProps) {\n  this.setState({count: this.props.count}); // always writes -> 50+ nested updates\n}\n\n// after\ncomponentDidUpdate(prevProps) {\n  if (prevProps.count !== this.props.count) {\n    this.setState({count: this.props.count});\n  }\n}","handlingStrategy":"validation","validationCode":"componentDidUpdate(prevProps) {\n  if (this.props.value !== prevProps.value && this.props.value !== this.state.value) {\n    this.setState({value: this.props.value});\n  }\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Always compare against prevProps/current state before setState in componentDidUpdate","Prefer getDerivedStateFromProps or render-time derivation over lifecycle state sync","Stabilize parent props (memoize objects/callbacks) so children's update lifecycles do not fire on identical data"],"tags":["infinite-loop","component-did-update","set-state","class-components"],"backgroundTag":"maximum-update-depth-exceeded","analyzedSha":"eafeac097ba51e1eab809c07102126bd5f8e5425","analyzedAt":"2026-08-21T22:01:08.818Z","schemaVersion":2},"datasetVersion":"2026-08-21T23:17:16.201Z"}