[React] Lodash의 debounce 사용법

debounce는 여러 번의 로직이 실행된다고 했을 때, 가장 마지막에 실행된 순간에서 더 이상 똑같은 로직이 실행되지 않는다면 이 순간부터 일정 시간 이후에 로직을 한 번만 모아서 실행하는 방법입니다.

 

이를 간단하게 사용할 수 있는 라이브러리가 있는데, 바로 Lodash입니다.

 

Lodash

https://lodash.com/docs/4.17.15#debounce

Lodash Documentation

 

설치 명령어

yarn add lodash.debounce

 

사용 예시

import debounce from 'lodash.debounce';

const debounceSetItem = debounce(setItem, 5000);

 

결과 화면

debounce를 활용하여 5초 뒤에 변경 사항이 반영됩니다.