debounce1 Debounce를 활용해서 api 요청 횟수 줄이기 0.TL;DR 검색 과정에서 지나치게 많은 api 호출이 일어나고 있었음 이에 Debounce를 사용해 0.5초간 추가적인 입력이 없다면 api 호출이 일어나도록 구현 하지만 비즈니스를 고려하지 못한 측면과 UX를 고려한 Loading UI를 구현하지 않아 아쉬움이 있음 1. Why? "관리하당"에서 음식 등록을 위한 검색 기능을 구현할 때, useEffect로 값이 변경될 때 마다 api를 호출해 검색 하도록 구현하니, 지나치게 api 전송이 자주 일어나고 있었다. 예를 들어 "삼겹살"을 검색한다면 ㅅ 사 삼 삼ㄱ 삼겨 삼겹 삼겺 삼겹사 삼겹살 삼겹살 한 번 검색하는데 api가 9번이나 전송되는 꼴이다. 또한 이 과정에서 검색 api가 실행되며 그 결과값을 나타내는 창이 9번이나 리랜더링이 일어나게 되.. 2023. 11. 30. 이전 1 다음