Recommended
Recommended
More Related Content
More from Wonjun Hwang
More from Wonjun Hwang (20)
디바운싱과 쓰로틀링
- 1. 디바운싱과 쓰로틀링 프로그래밍 기법 디바운싱과 쓰로틀링 방식에 대한 이해
- 2. 목차 디바운싱이란? 쓰로틀링이란? 디바운싱과 쓰로틀링 사용 예시 및 코드 디바운싱과 쓰로틀링 차이점 디바운싱 VS 쓰로틀링 마무리
- 3. 디바운싱이란? 스위치회로에서 사용하는 개념으로, 바운싱 현상을 방지하는 방법을 의미함 바운싱 현상? Row 상태와 High 상태가 스위치의 on/off로 동작할 때 스위치를 한번만 눌렀음에도 여러번 눌린 것 처럼 작동하는 현상
- 4. 해당 바운싱 현상을 방지하기 위해서 버튼을 처음 눌렀을 때, 또는 마지막으로 눌렀을 때의 값만 받는 것
- 5. 프로그램에서 디바운싱 연속해서 호출되는 함수 중 처음이나 마지막 요청을 기준으로 단 한 번의 함수만을 실행시키도록 하는 것 (주로 마지막 요청 기준으로 실행)
- 6. 쓰로틀링이란? 주로 PC나 하드웨어의 성능 제한과 관련하여 많이 사용되는 개념으로, 발열로 인한 기기의 손상을 막기 위해 클럭이나 인가 전압을 제한하여 발열을 낮추는 기법
- 7. 함수가 호출 된 이후, 설정 시간이 지나기 전 까지 다시 함수를 호출 하지 못하도록 하는 것 즉, 함수의 호출 빈도 수를 줄임 프로그램에서 쓰로틀링
- 8. • ajax 검색 • 폼 버튼 제출 • 스크롤 이벤트 • 브라우저 리사이즈 • 마우스 이동 이벤트 디바운싱과 쓰로틀링 사용 예시 디바운싱 쓰로틀링
- 9. 디바운싱 사용 예시 및 코드 ajax 검색 before after
- 10. 쓰로틀링 사용 예시 및 코드 resize 이벤트 before after
- 11. 직접 타이머 지정하여 구현하는 것 보단 lodash나 underscore.js와 같은 라이브러리 사용을 추천 사용 예시 및 코드
- 12. 모든 동작이 끝난 후 특정 시간이 지나면 함수 호출 연이은 요청 중 단 한번만 호출하도록 보장 지정시간에 무조건 한번은 호출하도록 보장 디바운싱과 쓰로틀링 차이점 디바운싱 쓰로틀링 첫 함수 호출 뒤 특정 시간이 지나면 다시 호출
- 13. 디바운싱 VS 쓰로틀링 같은 동작이라도 개발 우선 순위에 따라 선택 ex) 지도Api 호출
- 14. 마무리 디바운싱과 쓰로틀링 방식의 차이점을 이해하고 각 상황에 맞게 적절히 적용하여 서비스의 성능 및 비용을 개선하면 좋겠다.