react-redux (React bindings) vs Virtual Dom e Principio di responsabilità singola

Question

react-redux (React bindings) vs Virtual Dom e Principio di responsabilità singola

#1 da (4 voti)

2

Capisco React e Redux (almeno penso che lo faccia). Ma la combinazione che usa il pacchetto Binding react-redux mi confonde un po '.

link

La prima cosa che mi disturba è la motivazione a usare connect. Perché non usare semplicemente store.subscribe (() = > {this.setState ({})}) dal componente root?

Poiché lo store è globale, è possibile inviare un'azione da qualsiasi componente e ottenere lo stato corrente da qualsiasi competente gerarchia anche profondamente annidata. Quindi non abbiamo bisogno del react-redux per questo, anche se posso vedere come usare react-redux può renderlo più severo e sicuro legando solo le proprietà di cui abbiamo bisogno

Questa è la ragione dalla pagina redux per usare il pacchetto: link

React Redux makes many performance optimizations that are hard to do by hand

D'altra parte React ha Virtual Dom che: link

React creates an in-memory data structure cache, computes the resulting differences, and then updates the browser's displayed DOM efficiently. This allows the programmer to write code as if the entire page is rendered on each change, while the React libraries only render sub components that actually change.

Quindi mi sembra che Virtual Dom e react-redux possano fare lo stesso. Ciò viola il principio di responsabilità individuale. Perché abbiamo bisogno della complessità extra?

Puoi chiarire questo problema per me?

single-responsibility redux react

posta Natan Rubinstein 30.08.2017 - 00:12

fonte

1 risposta

Leggi altre domande sui tag single-responsibility redux react

Come evitare riferimenti circolari in OOP Javascript? Come gestire la configurazione e lo stato in un programma

score 4 · Accepted Answer

react-redux alla fine fornisce un modo conveniente di accedere allo store da qualsiasi componente (in realtà, come dice la documentazione, solo i componenti del contenitore dovrebbero connettersi al negozio). Ciò significa che qualsiasi componente che vuole ottenere dati può farlo senza fare affidamento su un componente padre che lo alimenta con oggetti di scena.

L'alternativa che suggerisci ("Perché non usare solo store.subscribe(()=>{ this.setState({}) }) dal componente root?") si interrompe se hai una gerarchia di componenti profonda. In tal caso, il componente root riceve i dati e deve passarli attraverso una catena di figli. In questo caso, non guadagni molto oltre il normale setState .

Inoltre con connect puoi selezionare le parti dello stato a cui stai accedendo, rendendo più chiari i dati utilizzati da ciascun componente.

Alla fine, il redux non è necessario per ogni app React, che dipende dal tuo caso d'uso. Ma se stai usando React e Redux, quella libreria ti aiuta a combinarli più facilmente rispetto a farlo da soli.