Debounce & Throttle

자바스크립트의 이벤트를 제어하는 Debounce와 Throttle에 대해 알아보자!

사용하는 이유

사용자와 상호작용하는 동적 페이지를 구현하기 위해 event는 무척 유용한 도구다. 그럼에도 불구하고 event가 불필요하게 자주 실행되면 성능 저하의 원인이 된다.
ex) scroll, drag, input(onChange)

차이점

DEBOUNCE

debounce:여러 이벤트가 발생하면, 그중 마지막 이벤트만 발생하도록 해 준다. 연속적이고 빠른 이벤트들을 그룹화해서 하나의 이벤트로 처리한다.

THROTTLE

Throttle 이벤트를 일정 주기마다 한 번씩만 발생하도록 해 준다. 이벤트가 한 번 실행되면 설정한 시간이 지나고 나야 다음 이벤트를 실행할 수 있다.