디바운싱
- 연이어 발생한 이벤트를 하나의 그룹으로 묶어서 특정시간 지난 후 하나의 이벤트만 발생하도록 하는 기술
- 웹에서 주로 ajax검색에 자주 쓰인다.
- 그룹에서 처음이나 마지막으로 실행된 함수를 처리하는 방식으로 사용
- leading edge: 처음에 실행한 함수를 실행하고 그 뒤 이벤트 무시
- trailing edge : 마지막에 실행한 함수를 실행하고 그 전의 이벤트 무시
쓰로틀링
- 마지막 함수가 호출되고 일정 시간이 지나기 전에 다시 호출되지 않도록 하는 것
- 성능 개선을 위해 사용(무한 스크롤)
- 이벤트를 일정주기마다 발생하도록 하는 기술
디바운싱 vs 쓰로틀링
- 디바운싱 : 스크롤이 내리다가 스크롤을 멈추고 정해진 시간 후 이벤트 발생.
- 쓰로틀링 : 이벤트 하나 발생하고 특정 시간동안 이벤트가 발생하지 않고, 그 시간이 지나면 다시 이벤트가 발생.
디바운싱 Leading Edge vs Throttling
- 디바운싱 Leading Edge : 설정한 타이머 시간 안에 요청이 지속적으로 들어올 경우 모든 요청 무시
- Throttling : 지속적으로 요청이 들어올 경우 정해진 타이머 시간이 지나면 요청 허용
둘을 이용할 땐 로대쉬를 사용하자.
참고
10분 테코톡 : https://youtu.be/By49qqkzmzA
제로초 블로그 : https://www.zerocho.com/category/JavaScript/post/59a8e9cb15ac0000182794fa
'TIL' 카테고리의 다른 글
tilde연산자 비트 연산자 (0) | 2022.11.29 |
---|---|
[TIL] 브라우저 타임존 테스트 (0) | 2022.08.21 |
[TIL] 클린 코딩 팁 3가지 (0) | 2022.07.03 |
[TIL] 브라우저 렌더링 (0) | 2022.06.14 |