React/React
[React] 렌더링 최적화를 위한 useDeferredValue / useTransition
리액트에서 무거운 연산이나 렌더링이 일어나면 메인 스레드가 블록 되기 때문에 다음 작업을 처리하지 못하거나, 프레임이 저하되는 문제가 발생할 수 있다.이러한 문제를 해결하기 위해 사용하는 훅(hook)인 useDefferedValue 와 useTransition 을 정리하고 비교해보려 한다. 1. useDefferdValue위와 같은 문제를 해결하기 위해 값의 업데이트 우선순위를 낮춰서, UI가 덜 중요한 업데이트를 늦게 처리하도록 도와주는 훅(Hook)이 useDefferedValue() 이다.const deferredValue = useDefferedValue(value); 2. useTransitionuseDefferedValue() 가 값을 래핑해서 업데이트 우선순위를 낮추다면,함수를 래핑해서 ..
