디바운스와 쓰로틀? 🤔
이벤트 핸들러가 너무 자주 실행되지 않도록 조절하는 기법
디바운스(debounce)
이벤트가 연속적으로 발생할 때 마지막 이벤트가 발생한 후 일정 시간이 지나야 이벤트 핸들러가 실행
ex) 검색창에 키를 입력할 때마다 검색 요청을 보내면 부하가 지나치게 커짐 ➡️ 사용자가 입력을 멈춘 후 일정 시간이 지나면 검색 요청을 보냄
쓰로틀(throttle)
일정 시간 간격 동안 발생한 이벤트 중 첫 번째 또는 마지막 이벤트만 처리
ex) 연속 클릭을 할 때 클릭할 때마다 이벤트가 발생 ➡️ 매번 처리하면 부하가 커짐 ➡️ 쓰로틀을 적용해서 한 번만 처리하게 할 수 있음
무한 스크롤 구현 ♾️
무한 스크롤 구현 시에는 쓰로틀이 적합하다.
왜일까❓
스크롤은 연속적인 동작이고 페이지 하단에 도달했을 때 즉각적인 반응을 사용자는 원함 ➡️ 쓰로틀을 적용하게 되면 스크롤이 하단에 위치하게 된 순간 즉시 데이터 요청을 수행 ➡️ 사용자에게 자연스러운 스크롤 경험 제공 가능
