How can I prevent my UserList component from re-rendering when the data hasn’t changed?

If your UserList component re-renders even when the data doesn’t change, it means React thinks something in its props or state is new every time.

Here’s how to fix it

1. Use React.memo
   Wrap the component with React.memo(UserList) so it only re-renders when props actually change.
   Why: React skips re-rendering if props are the same.
2. ⚙️Stabilize props
   If you’re passing functions or arrays/objects as props, wrap them with useCallback or useMemo.
3. Check parent re-renders
   If the parent re-renders unnecessarily, it can cascade down.
   Fix: Use memoization or split components to isolate state.

Use React.memo and stabilize props with useMemo / useCallback to prevent unwanted re-renders when data hasn’t changed.