REACT · CONCURRENT
긴급 업데이트와 지연 업데이트 분리
Concurrent Hook은 입력처럼 즉시 반응해야 하는 업데이트와 무거운 목록 렌더처럼 지연 가능한 업데이트를 분리합니다.
핵심 구조
priority
input value
긴급 업데이트 즉시 반영
startTransition
무거운 state 갱신 표시
deferred value
느린 값은 뒤따라 반영
pending UI
지연 중 상태를 표시
input value
→
startTransition
→
deferred value
→
pending UI
판단 기준
check
입력감
타이핑 state는 긴급 업데이트로 유지합니다.
무거운 렌더
필터링 목록이나 검색 결과는 transition 후보입니다.
취소 가능
더 최신 업데이트가 오면 이전 렌더는 밀릴 수 있습니다.
fallback
pending 표시가 없으면 사용자는 멈춘 것처럼 느낄 수 있습니다.