Memory Leak - Component Doesn't Clean Up Resources
Your app gradually uses more memory the longer it runs. DevTools shows increasing memory usage even after navigating away from components.
The app slows down over time or crashes after extended use.
Error Messages You Might See
Common Causes
- useEffect without cleanup function for event listeners, intervals, subscriptions
- Setting state on unmounted component
- Global state not being cleared when component unmounts
- WebSocket or fetch requests not aborted on cleanup
- Timer/interval not cleared in cleanup
How to Fix It
Always return cleanup from useEffect: useEffect(() => { const timer = setInterval(...); return () => clearInterval(timer); }, [])
Abort fetch requests: const controller = new AbortController(); fetch(url, { signal: controller.signal }); return () => controller.abort()
Remove event listeners: addEventListener then removeEventListener in cleanup
Check for 'Can't perform a React state update on an unmounted component' warnings
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
When does cleanup function run?
Before component unmounts and before effect runs again (if dependencies change)
Do all useEffects need cleanup?
No, only those that start resources: listeners, intervals, subscriptions, fetches, timers
How do I detect memory leaks?
DevTools Memory tab: take heap snapshot, navigate, take another. Growing objects = leak