[FE 최적화 기술] Throttle, Debounce, useDeferredValue, useTransition 쉽게 정리하기 😊

리액트를 쓰다 보면 ‘입력이 느려요’, ‘렌더링이 버벅여요’ 같은 이야기를 들을 수 있다.(혹은 무한 랜더링...) 그럴 때 우리가 쓸 수 있는 대표적인 성능 최적화 기법 네 가지가 바로 다음과 같다.위의 두 가지는 일반적인 방법론이고, 뒤의 두 가지 훅은 리액트 18부터 사용할 수 있는 최적화 훅이다.🧂 Throttling💧 Debouncing🕓 useDeferredValue🌀 useTransition이 글에서는 각 개념이 언제, 왜, 어떻게 쓰이는지를 쉬운 예제와 함께 알아보자. [🧂 Throttling] 너무 자주 부르지 않게 하기특정 시간 동안 이벤트가 여러 번 발생하더라도, 일정 시간 간격으로만 함수를 실행하는 방식이다. 언제 사용할까?스크롤, resize 이벤트 같이 계속 발생하는 이..