memo decision

부모가 다시 렌더링될 때 props 경계를 먼저 본다

memo 계열 도구는 렌더를 막는 주문이 아니라 참조 안정성과 실제 렌더 비용을 함께 확인하는 선택지입니다.

1. 부모 리렌더링

trigger

부모의 state나 context가 바뀌면 자식도 다시 호출될 수 있습니다. 먼저 이 렌더가 사용자 동작에서 자주 일어나는지 봅니다.

변화 있음 부모는 정상 렌더
자식 확인 비싼 렌더인지 측정

2. props 참조 안정성

compare

문자열과 숫자는 비교가 쉽지만, 객체와 함수는 매 렌더마다 새 참조가 되면 memo 경계를 통과하지 못합니다.

useMemo useCallback deps 점검

3. 자식 렌더 여부

decide

props가 안정적이고 자식 렌더 비용이 크다면 React.memo가 효과적일 수 있습니다. 가벼운 자식은 그냥 렌더하는 편이 더 단순합니다.

비용 큼 React.memo 적용
다시 측정 개선 없으면 제거