Throttling & Debouncing

Yeeeeeun_IT·2022년 8월 26일
0

디바운스와 쓰로틀은 짧은시간 연속으로 발생하는 이벤트를 그룹화하여 과도한 이벤트 핸들러의 호출을 방지하는 프로그래밍 기법이다.
이는 모든 변화를 감지하여 바로 바로 렌더하는 것이 아니라, 일정 조건하에 호출 빈도를 줄여 서버의 성능 개선에 도움을 줄 수 있다.

Throttling

쓰로틀링(Throttling)이란 마우스 이동, 스크롤 이동을 감지하면 특정 이벤트를 실행시키고, 이동이 멈출때까지, 이벤트가 재실행 되지 않도록 막기 위해 사용한다.
즉, 함수가 지정된 시간 동안 최대 한 번 호출되도록 하는데 이를 돕는 라이브러리로 lodash가 있다.

사용예시: 무한스크롤
스크롤을 내리는 매 순간 리패치가 되지 않고 일정구간 스크롤 후 다시 리패치된다.

Debouncing

디바운싱(Debouncing)은 이벤트가 반복되어 호출되는 동안 특정시간이 지날때까지 이벤트가 반복적으로 일어나지 않도록 돕는다. 즉 다음 함수가 실행되기 전 일정 시간을 대기한다.

사용예시: 검색 기능 구현하기
input 이벤트에서 검색어를 입력할때 모든 변화를 렌더링하는 것이 아니라,
검색어/단어 입력이 완료되면(특정 시간이 지나면) 렌더링을 실시한다.

profile
🍎 The journey is the reward.

0개의 댓글