profile
개발공부 막 시작했습니다 틀린정보가 있을경우 알려주시면 감사하겠습니다
post-thumbnail

Debouncing & Throttling

Debouncing 디바운싱: 특정 함수를 여러번 계속해서 호출했을을시 마지막 호출로 부터 지정한 시간이 지났을때 실행을 함 onChange를 사용하여 State값을 변경할때 한글자 한글자 변경시 마다 리렌더링이 일어나서 비효율적이다 Debouncing을 사용하면 이 리렌더링을 줄일수 있다 Lodash라이브러리를 사용했다 위의 코드는 input을 입력시 onChange가 일어나게 되고 getDebounce이 호출된다 그럼 이 디바운스는 0.5초간 다음 호출이 없으면 getDebounce함수를 실행하게 되는것이다 여기서 0.5초가 지나기 전에 다시 입력을 해서 onChange가 일어나면 다시 0.5초부터 시작한다 위 gif는 검색어를 입력후 디바운싱에 의해 0.5초후 해당 데이터

2023년 3월 6일
·
0개의 댓글
·