Relax and just watch the demo by opening the network tab, quickly reloading the webpage again with network tab open and don't forget to quickly clear the network tab as soon as webpage reloads to see useDebounce in action.
Automatically 1 to 12 user id will change and you just have to observe the network call. Here according to user id you will see fetched list of title of that user.
Here in this example caching is on so after user id 6 it will again start user id from 2, at this point of time you will notice in network tab that network call for user id 2 to 6 will not be called again as result for user id 2 to 6 are cached. As soon as it reaches user id 7 you will notice network call for user id 7.
There are no list for user id 11 and 12 so nothing will be displayed, but still continue to observe, user id again start from 1 and you will notice that network call for user id 1 is made, Why so? As said is documentation it only caches 10 result when network call for user id 11 is made cached result for user id 1 is deleted from cache and again for next network call with user id 12 it deletes cached result of user id 2. Now after 12 it starts again from 1 and as there is no result in cache for user id 1 it will make network call.
Ignore call for empty or null user id on initial load as that network call will not be stored in cache.
Happy Exploring 😉.
User ID
List of Titles
et ea vero quia laudantium autem
in quibusdam tempore odit est dolorem
dolorum ut in voluptas mollitia et saepe quo animi
voluptatem eligendi optio
eveniet quod temporibus
sint suscipit perspiciatis velit dolorum rerum ipsa laboriosam odio