React.memo·useMemo·useCallback의 이름을 외운 수준인지, 어디에 왜 적용해야 하는지와 효과를 어떻게 확인하는지까지 답할 수 있는지를 가른다.
불필요 리렌더를 줄이는 출발점은 메모이제이션이 아니라 상태 위치다. 상태를 쓰는 컴포넌트 가까이에 두고 큰 Context를 구독 단위로 쪼개면 파급 렌더가 먼저 줄어든다. 그 위에서 React.memo·useMemo·useCallback을 병목으로 확인된 구간에만 얹어야 효과가 나온다. 측정 없이 훅부터 두르면 비교 비용과 코드 복잡도만 늘고 체감 성능은 그대로 남는다.
리스트 스크롤이 끊겨서 Profiler로 원인을 좁혀본 경험이 있다면 어떤 prop 변화로 어떤 컴포넌트가 다시 그려졌는지 설명할 수 있다
큰 Context를 쪼개거나 상태를 끌어내려 렌더 폭을 줄여본 경험을 메모이제이션을 먼저 시도하지 않은 이유와 연결할 수 있다
useMemo·useCallback을 두르고도 효과가 없었던 사례가 있다면 의존성 배열이나 새 객체 생성 같은 무효화 원인을 짚어 답할 수 있다
아직 공개된 답변이 없어요. 첫 공개 답변을 남겨보세요.