Reactjs Usedeferredvalue Deep Low Priority Render Input Lag

Definisi

useDeferredValue mengembalikan versi "tertunda" dari nilai yang mungkin mahal untuk di-render. Berbeda dengan useTransition (membungkus update state), useDeferredValue cocok saat nilai datang dari luar (prop, URL, event tanpa control state).

Kapan dipakai

Pakai saat:

• Input pencarian memicu render berat tapi kamu tidak punya state lokal untuk di-bungkus transition.
• Nilai berasal dari parent/prop dan ingin versi lama tetap tampil saat yang baru sedang diproses.

Jangan pakai untuk update yang harus instan (typing di field sendiri).

Cara kerja

jsx

function Search({ list }) {
  const [query, setQuery] = useState('');