RENDER MAP

리렌더링은 정상 동작이고, 비용이 커질 때 최적화 대상이 된다

React는 입력이 바뀌면 컴포넌트 함수를 다시 실행합니다. 중요한 것은 어떤 입력이 바뀌었고 그 결과로 어떤 자식까지 다시 계산되는지 분리해서 보는 것입니다.

State 변경

컴포넌트 내부 상태가 바뀌면 해당 컴포넌트부터 다시 렌더링됩니다.

범위본인과 자식

힌트상태 위치를 낮추기

값이 같아 보여도 객체, 배열, 함수 참조가 새로 생기면 변경입니다.

범위받는 자식

힌트참조 안정화

부모가 다시 실행되면 기본적으로 자식 함수도 다시 호출됩니다.

범위하위 트리

힌트memo 경계 확인

Context 값이 바뀌면 구독 중인 컴포넌트가 함께 갱신됩니다.

범위구독 컴포넌트

힌트값 분리