debounce

[Javascript] Throttle 과 Debounce

Throttle과 Debounce의 등장 배경 Throttle 과 Debounce 는 DOM 이벤트를 제어하는 방법으로 자주 호출되는 이벤트의 실행 빈도를 줄여 성능상의 이점을 얻기 위해 사용한다. Throttle과 debounce를 사용할 수 있는 대표적인 상황은 아래와 같다. 스크롤링을 통한 데이터 노출 검색어 입력시 자동완성 예를 들어 스크롤 이벤트를 감지하여 API를 호출해 데이터를 가져오고자 하는 상황이라고 가정해보자. 이때, 사용자가 스크롤을 움직일 때마다 수많은 스크롤 이벤트가 발생할 것이고 이는 수많은 API 호출로 이어질 것이다. 매번 스크롤 이벤트에 대한 콜백이 발생하고 해당 콜백의 수행은 매우 큰 리소스를 차지하게 된다. 이는 결국 서비스의 성능과 사용자의 경험 저하를 야기하게 된다...