Context Tuning

Context value는 작고 안정적으로 유지합니다

Provider의 value가 바뀌면 그 Context를 읽는 컴포넌트들이 다시 렌더링됩니다. 값의 책임을 나누고 범위를 좁히면 변경이 닿는 소비자 수를 줄일 수 있습니다.

Split

관심사별 Context 분리

인증 변경 때문에 테마 소비 컴포넌트까지 렌더링되지 않도록 값을 책임별로 나눕니다.

범위

필요한 하위 트리만 감싸기

앱 전체 Provider보다 기능 영역 Provider가 더 작은 렌더 범위를 만들 수 있습니다.

Value

객체와 함수 안정성 점검

새 객체를 매번 만들면 구독자가 다시 깨어납니다.

Local

빠른 입력은 가까이 두기

검색어, hover, 임시 form은 내부 상태가 더 가볍습니다.

ThemeContext 테마 이름과 토글 함수처럼 낮은 빈도로 바뀌는 값
AuthContext 로그인 사용자, 권한, 로그아웃 함수처럼 인증 기준이 되는 값
Page State 검색어, 정렬 선택, 모달 열림처럼 화면 안에서만 쓰는 값
변경value 갱신
구독useContext
렌더소비자 갱신
분리범위 축소

읽는 포인트 Context 최적화의 출발점은 특별한 기법보다 값의 책임 분리입니다. 같은 이유로 함께 바뀌는 값만 같은 Provider에 둡니다.