avallete
avallete14mo ago

query debounce

Hey there ! I wonder if anyone could point me to a standard recipe to achieve query debouncing and caching using trpc and useQuery in react. I'm basically firing an api call everytime the user change his input which start to be quite a lot when he keep the "delete" key pressed on the keyboard.
3 Replies
Nick
Nick14mo ago
You can debounce the parameters which drive useQuery instead There are several useDebounce hooks out there 🙂
avallete
avallete14mo ago
Hey ! Thank's for the answer. Yes indeed there is several options out there. That's why I wondered if there were a "recommended" one. What I can think of when I think of debounce is 2 things: 1. Not calling the endpoint at all with as you mentioned parameters debouncing 2. Cancelling actives queries on a defined endpoint to only get result "for the last one" (especially efficient if the query response time is long but params debounce time is short). 3. A combination of the two ?
Nick
Nick14mo ago
Ideally both! Ultimately do what solves your problems and no more, though