Your question is Optimizing Nested React State. Take a moment with it on the right.
Talk me through your thinking if you like. When you're confident, submit your answer and I'll grade it like a real screen (7/10 or better passes).
How do you manage complex, nested state in a React application without sacrificing rendering performance? Explain how you would choose between local state, useReducer, Context, and an external store, and how you would prevent unrelated components from rerendering. Keep the answer focused on React rendering behavior, state structure, referential equality, memoization, and practical profiling techniques.