reactjs / reactjs/react.dev

The following two paragraphs in "Splitting High and Low Priority State" in Concurrent UI Patterns creates confusion

Offen
#2,715 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Vorherrschende Sprache
JavaScript
Sterne
11.8k
Forks
7.9k
Ø Merge
1 T. 11 Std.
Gemergte PRs (30 T.)
11

Beschreibung

When you design React components, it is usually best to find the “minimal representation” of state. For example, instead of keeping firstName, lastName, and fullName in state, it’s usually better keep only firstName and lastName, and then calculate fullName during rendering. This lets us avoid mistakes where we update one state but forget the other state.

However, in Concurrent Mode there are cases where you might want to “duplicate” some data in different state variables.

Isn't this how we build React apps anyways -- we store query value in a one state and data in another state? I am asking this because the description at the beginning of this section does not provide relevant information for the rest of the section, which mainly talks about moving setResource to startTransition to make it "low priority". In contrary, it creates a confusion that putting input value and API data in the same state was a normal occurrence. Even in the provided example, we are not really duplicating data -- we are just using each data in a different way (one in a normal way and another one inside startTransition).

If the idea of duplication is that resource and state coexist as a duplicate data, I think that also contradicts all the previous sections on this page because we have been storing "concurrent resource" in the state for "profile change" example etc.

I suggest that we remove these bits and replace it with something like:

In the past, when designing React components, we would handle input state and data state within the same application flow using React's state management. However, existing flow cannot be applied when data is being handled using concurrent mode APIs. Consider this tiny translation app:

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Suchen Sie im React-Dokumentationsbereich den Abschnitt „Splitting High and Low Priority State“ und lesen Sie den ihn umgebenden Inhalt zu Concurrent UI Patterns. Ersetzen Sie die verwirrenden einleitenden Absätze durch eine Formulierung, die zum Beispiel für input state, data state und startTransition passt; abgeschlossen ist die Aufgabe, wenn die Erklärung des Abschnitts mit dem Beispiel und den früheren Abschnitten konsistent ist.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, react
Bereich
documentation
Issue-Typ
Dokumentation
Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Aktivitätsstatus
Veraltet
Klarheit
Klar beschrieben
Anfängerfreundlichkeit
55/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.