How does cleanup differ between componentDidMount and useEffect?
componentDidMount has no cleanup of its own; you clean up in a separate componentWillUnmount method. useEffect combines setup and cleanup in one function: you return a cleanup function from the same effect that did the setup.
Verify This Answer
Cross-check this information using these trusted sources:
More FAQs in componentDidMount vs useEffect: Mapping Class Lifecycle to Hooks
For the mount case, useEffect with an empty dependency array matches componentDidMount. But useEffect is more flexible: with dependencies it also runs on updates, and it combines setup with cleanup in one function, which componentDidMount does not.
componentDidMount runs synchronously after the DOM update. useEffect runs asynchronously after the browser paints, so the user sees the UI before the effect runs. This is a real behavioral difference to be aware of when converting.
Yes. With the relevant values in the dependency array, useEffect runs when those values change, matching componentDidUpdate. The same hook covers mount, update, and unmount depending on the array and cleanup.
Still have questions?
Browse all our FAQs or reach out to our support team