Kaj so sočasne funkcionalnosti, kot sta useTransition in useDeferredValue?

Question

Accepted Answer

Concurrent React lahko **prekine, premori in postavi prioritete** delu prikaza. Nekatere posodobitve označiš kot **nepomembne prehode**, tako da ostanejo nujne posodobitve (kot je pisanje) odzivne tudi medtem ko je težak ponoven prikaz v čakanju.

## useTransition

```jsx
const [isPending, startTransition] = useTransition();

function onChange(e) {
  setQuery(e.target.value);          // URGENT: keep the input snappy
  startTransition(() => {
    setResults(filterBigList(e.target.value)); // NON-URGENT: can be interrupted
  });
}
// isPending lets you show a subtle "updating…" indicator
```

**Zakaj je to koristno:** filtriranje ogromnega seznama je drago. Brez prehoda bi React blokiral vnos med ponovno prikazom tisoče vrstic, zato se pisanje počutijo počasnemu. Z obdelanim dragim posodabljenjem v `startTransition` React ohrani posodobitve vnosa z visoko prioriteto in lahko **zavrže** postopni prikaz filtriranja, če napišeš drugo tipko — brez zastareli, treskav kadrih.

## useDeferredValue

Enostavnejša alternativa, ko ne nadziraš setter — ti daje "zaostalo" kopijo vrednosti:

```jsx
const deferredQuery = useDeferredValue(query); // updates after urgent work settles
const results = useMemo(() => filterBigList(deferredQuery), [deferredQuery]);
```

## Kdaj jih uporabiti

Uporabi te za **drage, nepomembne posodobitve UI** poganjane hitrim vnosom uporabnika: iskanje med pisanjem na velikih zbirkah podatkov, preklapljanja zavihkov, ki prikazujejo težko vsebino, velike filtrirane/razvrščene tabele. Za preprosta aplikacije so nepotrebni — sijejo, ko je prikaz dovolj težak, da povzroči vidno zakasnitev vnosa.