Reagiert immer der ganze Baum?

Question

Wenn eine Komponente durch Aufrufen von setState aktualisiert wird, führt React den Diffing-Algorithmus für die gesamte DOM-Struktur oder nur für den Teil der aktualisierten Komponente aus?

Zum Beispiel, wenn ich 10000 Komponenten in meiner App habe und setState in einer Komponente aufrufen, die keine Kinder hat (es ist ein Blatt des Baumes), wird React den gesamten großen DOM-Baum durchlaufen (was langsam wäre) nur der DOM-Baum, der von der Komponente generiert wird (was viel schneller wäre)?

Answer 1

Nein, React wird nicht durch den gesamten Baum gehen, wenn Sie setState nur auf einem Blattknoten aufgerufen haben.

Bei Aufruf von setState wird react nur die Komponente (Baumknoten), für die setState aufgerufen wurde, und alle Komponenten (Knoten), die untergeordnet sind, erneut rendern. Es sollte beachtet werden, dass React das DOM nur dann aktualisiert, wenn tatsächlich eine Änderung vom Aufruf von setState dargestellt wird.

Vjeux, eines der Mitglieder des React-Teams, schrieb einen guten Blogbeitrag, in dem beschrieben wird, wie der read diff-Algorithmus funktioniert und wie er funktioniert, wenn Sie setState aufrufen. Hier ist die link.