용어 사전 coding 용어 페이지

스로틀

연속 이벤트를 정해진 간격으로만 실행하게 묶는 최적화 기법

throttle #javascript#performance#frontend
English version

다른 이름

throttle간격 제한

선수 개념

관련 개념

핵심 아이디어

스로틀은 이벤트가 매우 자주 발생하더라도, 정해진 시간 간격마다 한 번씩만 실행하도록 제한하는 패턴입니다. 스크롤, 리사이즈, 마우스 이동처럼 초당 수십 번 이상 발생하는 입력을 그대로 처리하면 UI가 쉽게 버벅이기 때문에 자주 사용합니다.

디바운스가 "잠잠해진 뒤 마지막 한 번"에 가깝다면, 스로틀은 "지속되는 동안에도 주기적으로 한 번씩" 실행한다는 차이가 있습니다. 그래서 진행률 표시, 위치 추적, 스크롤 반응처럼 중간 상태도 계속 반영해야 하는 작업에 잘 맞습니다.

이 블로그에서의 역할

Mathbong에서는 이벤트 루프와 브라우저 렌더 흐름을 배운 뒤, 과도한 이벤트를 다루는 실전 패턴으로 스로틀을 설명합니다. 디바운스와 짝을 이루며 "언제 마지막 한 번만 남길지, 언제 간격을 유지할지"를 판단하는 기준이 됩니다.

이 개념을 다루는 글