React Components Rerendering Excessively
After Cursor refactored your React component code, components are re-rendering far too frequently, causing performance degradation and jank on the page.
Components that shouldn't re-render are being triggered by parent updates.
Error Messages You Might See
Common Causes
- Props or state objects recreated on every render (inline object/function creation)
- useCallback or useMemo removed to simplify code, eliminating optimization
- Parent passes new object reference every render even if contents identical
- Incorrect dependency arrays in useEffect (missing dependencies)
- Context consumer re-renders when context value changes (even unrelated)
How to Fix It
Use React DevTools Profiler to identify re-renders. Wrap components with React.memo() for prop comparison. Use useCallback/useMemo for functions/objects passed as props. Check dependency arrays. Split context if some parts change frequently.
Real developers can help you.
You don't need to be technical. Just describe what's wrong and a verified developer will handle the rest.
Get HelpFrequently Asked Questions
How do I find unnecessary re-renders?
React DevTools Profiler tab. Highlight updates shows which components re-rendered. Check props/state actually changed.
What's React.memo?
HOC that memoizes component. Re-renders only if props change (shallow comparison). Use for expensive components.