Let's talk about `useDeferredValue` hook from #reactjs 18.
In some cases it could replace `debounce` func.
It lets you defer updating a part of the UI.
Small π§΅
In some cases it could replace `debounce` func.
It lets you defer updating a part of the UI.
Small π§΅
During the initial render, the returned deferred value will be the same as the value you provided.
During updates, React will first attempt a re-render with the old value (so it will return the old value), and then try another re-render in background with the new value.
During updates, React will first attempt a re-render with the old value (so it will return the old value), and then try another re-render in background with the new value.
The values you pass to it should either be primitive values (strings, numbers) or objects created outside of rendering.
If you create a new object during rendering and immediately pass it to useDeferredValue, it will be different on every render, causing unnecessary re-renders.
If you create a new object during rendering and immediately pass it to useDeferredValue, it will be different on every render, causing unnecessary re-renders.
useDeferredValue is integrated with <Suspense>. If the background update caused by a new value suspends the UI, the user will not see the fallback.
They will see the old deferred value until the data loads.
They will see the old deferred value until the data loads.
There is no fixed delay caused by useDeferredValue itself.
As soon as React finishes the original re-render, React will immediately start working on the background re-render with the new deferred value.
As soon as React finishes the original re-render, React will immediately start working on the background re-render with the new deferred value.
The background re-render caused by useDeferredValue does not fire Effects until itβs committed to the screen.
If the background re-render suspends, its Effects will run after the data loads and the UI updates.
If the background re-render suspends, its Effects will run after the data loads and the UI updates.
Stupid GPT is lying to me again, saying useDeferredValue returns a tuple π‘π‘
It is not!
It is not!
β’ β’ β’
Missing some Tweet in this thread? You can try to
force a refresh
γ
