JS - 쓰로틀링(throttling)과 디바운싱(debouncing)
✅ 쓰로틀링과 디바운싱은 모두 웹에서 발생하는 이벤트를 제어하는 방법으로 불필요한 이벤트가 호출되는 것을 방지합니다. 예를 들어 검색어 자동완성 기능, 스크롤 관련 동작과 같은 이벤트에서 매번 입력, 스크롤에 대한 콜백이 발생하고 계속해서 콜백을 수행하는 일은 큰 리소스를 요구하기 때문에 서비스의 성능 저하 및 사용자 경험 저하를 야기합니다. 따라서 상황에 맞게 쓰로틀링이나 디바운싱을 적용하면 최적화하는데 큰 도움이 됩니다. 📌 쓰로틀링(throttling) 쓰로틀링은 마지막 함수가 호출된 후 일정 시간이 지나기 전에 다시 호출되지 않도록 제어하는 것 입니다. 개발자가 몇 초마다 한 번씩 실행되게 제한을 두는 것입니다. 주로 스크롤 이벤트에서 많이 사용합니다. 쓰로틀링 구현 포인트 ! 1. 함수가 실행 ..
JavaScript
2022. 9. 8. 19:11
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 가상스크롤
- 1급 객체
- 시맨틱 웹
- React로 쓰로틀링 디바운싱 구현
- javascript
- vue
- 목표 일기
- redirects
- next.js 환경변수
- useRef
- Next.js
- 호이스팅
- redux
- 매겨변수와 인자
- rewrites
- array
- debouncing
- 렌더링 속도 개선
- Virtual Scroll
- react
- zustand
- 1급 함수
- 타입스크립트
- programmers
- 자바스크립트 비동기 동작원리
- 자바스크립트 동작원리
- next.js에 .gitignore가 적용되지 않을 때
- 1급 시민
- 함수형 컴포넌트
- typescript
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
글 보관함