
개발
[React] Debounce 훅 구현하기
개발을 진행하다보면 input의 onChange 또는 scroll에 관련 이벤트를 연결하는 경우가 종종 있다. 만약에 input의 onChange에 API를 요청하는 이벤트가 걸려있다고 가정해보자. "hello"라는 다섯글자에 총 5번의 API 요청이 실행된다. 아무리 생각해도 너무 비효율적이다. 따라서 연이어서 호출되는 이벤트 중 마지막 이벤트만 실행되도록 구현해보자. 사실 debounce는 throttle과 떼어놀 수 없는 사이이지만, 이번 포스팅에서는 debounce에 대해서 다루고, 다음에 기회가 되면 예제와 함께 throttle에 대해서 다뤄보는 시간을 가지도록 하겠다. debounce 란? debounce는 사실 전자 공학에서 유래된 용어이다. 스위치 센서나 터치 센서를 다룰 때, 순간적으로..