useThrottle 1
[React] 함수의 중복 호출을 막기 위한 throttling 기능 적용기
문제사항 const handleSubmit = async () => { // API 호출... }; API를 호출하는 위와 같은 함수가 있습니다. 이러한 함수는 보통 button, input의 이벤트 함수에서 실행되는데, 예를 들어 유저가 단시간 내에 버튼을 여러번 클릭시 API 통신 오류가 발생하는 경우가 있었습니다. 이에 해당 함수의 클릭 시간을 조절하는 throttle기능이 필요했고, 이를 구현한 방법을 소개하겠습니다. 중복 호출을 막기 위한 useThrottle 훅 구현하기 throttle기능을 구현하는 방법 중에는 여러 방법이 있지만, 저는 slash 라이브러리처럼 함수 전체를 감싸서 throttle기능을 적용하는 방식으로 구현하고 싶었습니다. 이에 throttle의 callback의 시간을 관..
Frontend/react | 2024. 1. 4. 00:06