본문 바로가기

프론트엔드

42. Debouncing, Throttling

Debouncing

디바운싱이란 여러 번 발생하는 이벤트를 한 개의 그룹으로 묶어 한꺼번에 보내는 방식으로 마지막으로 이벤트가 발생한 시점으로부터 일정 시간 동안 이벤트가 발생하지 않으면 실행되는 방식으로 주로 검색 기능에서 쓰이게 됩니다.

위의 예시 코드 처럼 lodash 라이브러리를 import해서 아래 예시 코드처럼 사용할 수 있습니다.

 

Throttling

쓰로틀링은 디바운싱과 다르게 처음 이벤트가 발생하면 이후 발생하는 이벤트는 일정 시간동안 무시하는 방식으로 주로 스크롤 기능에서 쓰이게 됩니다.

'프론트엔드' 카테고리의 다른 글

44. React Currying  (0) 2023.05.07
43. Context api, Redux, Mobx, SWR  (0) 2023.05.07
41. Shallow routing, Object.keys(), values, entries, assign  (0) 2023.05.07
40. JS 기본 상식  (0) 2023.05.07
39. Docker  (0) 2023.05.05