Discuss how setup and cleanup function is called in useEffect hook?

You need to fetch user data when a component mounts and cancel the request if the component unmounts. How would you structure the useEffect, and when does the cleanup run?

If you add a console.log inside the effect body and another inside its returned cleanup function, what order will the logs appear during mounting, updating, and unmounting?

Your team notices that a WebSocket opened in a useEffect is not closing when navigating away, causing duplicate messages. Walk me through how you would debug the cleanup timing and fix it.

You have a useEffect that depends on a prop which changes frequently. Explain why the cleanup runs on each prop change and how you might throttle or debounce the effect.

In a large dashboard, dozens of components each set up interval timers in useEffect. Describe a strategy to ensure all timers are cleaned up efficiently and avoid performance degradation.

When refactoring a legacy class component that uses componentWillUnmount for cleanup into a functional component, what pitfalls could arise with the useEffect cleanup, especially regarding closures and stale references?

Your organization is migrating a monorepo of React apps to a shared hooks library. How would you design the library’s useEffect patterns to enforce correct cleanup across teams and prevent subtle bugs in long‑running components?

Consider a real‑time analytics platform where components subscribe to a global event bus. At scale, missing cleanups cause memory leaks. What architectural guidelines would you set for useEffect usage, and how would you enforce them in code reviews or linting?