Le persone spesso scelgono Redux senza effettivamente averne bisogno.

"La nostra applicazione sarà scalabile senza?".

Quindi gli sviluppatori si lamentano della complessità introdotta nel loro codice:

"Perché devo modificare 3 file per eseguire una funzione?"

Infatti, perché?

Redux, React, programmazione funzionale, immutabilità e tutto il resto sono accusati di essere la fonte di tutti i problemi e lo capisco. È normale confrontare Redux con un approccio che non necessita di codice standard per aggiornare lo stato e concludere che Redux è semplicemente complicato. In un certo senso, è vero, ed è intenzionale.

Redux offre un contratto.

Ti chiede di impegnarti a:

• Descrivi lo stato dell'applicazione con oggetti e array semplici.
• Descrivi le modifiche al sistema con oggetti semplici.
• Descrivere la logica che gestisce le modifiche con le funzioni.

Nessuno di questi vincoli è necessario per creare un'app, con o senza React. In effetti, questi sono vincoli forti e dovresti pensarci due volte prima di adottarli (anche in parte) per la tua app.

Hai (veramente) buone ragioni per farlo?

Questi vincoli sono interessanti perché aiutano a creare app che:

• Mantieni lo stato nella memoria locale e inizia a essere pronto per l'uso
• Precompila lo stato sul server e invialo al client in HTML e inizia a essere pronto per l'uso
• Serializza le azioni dell'utente e un'istantanea dello stato nel sistema automatico di segnalazione dei bug in modo che gli sviluppatori possano riprodurle per riprodurre gli errori.
• Passa le azioni degli oggetti attraverso la rete per implementare ambienti collaborativi senza modifiche drastiche al modo in cui il codice viene scritto.
• Mantieni la cronologia degli annullamenti o implementa mutazioni ottimistiche senza modifiche drastiche alla modalità di scrittura del codice.
• Vai avanti e indietro tra la cronologia dello stato di sviluppo e rivaluta lo stato corrente dalla cronologia delle azioni quando il codice cambia "à la TDD".
• Fornisci strumenti di ispezione e controllo in modo che gli sviluppatori possano creare strumenti personalizzati per le loro app.
• Offri variazioni sull'interfaccia utente mentre riutilizzi la logica aziendale

Se stai lavorando su a terminale espandibile, un programma di debug javascript o tipo di app web, potrebbe valere la pena considerare alcune di queste idee (che tra l'altro non lo sono non nouvelles).
Detto questo, se stai imparando React, non utilizzare Redux per impostazione predefinita. Invece, impara a pensa in Reagire. Torna su Redux se ne senti davvero il bisogno o vuoi provare qualcosa di nuovo. Usalo con cautela, come faresti con uno strumento altamente supponente.
Se ti senti sotto pressione per fare "alla maniera Redux", potrebbe essere un segno che tu o il tuo team state prendendo le cose troppo sul serio. Non è né più né meno che uno strumento nella tua cassetta degli attrezzi, un'esperienza chi ha spirale fuori controllo.
Infine, ricorda che puoi implementare idee Redux senza usare Redux.
Ad esempio, ecco un componente React con stato locale:

import React, { Component } from 'react';
class Counter extends Component {
  state = { value: 0 };
  increment = () => {
    this.setState(prevState => ({
      value: prevState.value + 1
    }));
  };
  decrement = () => {
    this.setState(prevState => ({
      value: prevState.value - 1
    }));
  };
  render() {
    return (
      <div>
        {this.state.value}
        <button onClick={this.increment}>+</button>
        <button onClick={this.decrement}>-</button>
      </div>
    )
  }
}

È molto buono così. Seriamente, vale la pena ripetere:

Gli stati locali stanno bene.

La controparte che Redux offre è di aggiungere l'indirizzamento per separare "cosa è successo" da "come cambia".
È ancora un buon modo per andare? No, è un compromesso.
Ad esempio, possiamo estrarre un riduttore dal nostro componente:

import React, { Component } from 'react';
const counter = (state = { value: 0 }, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return { value: state.value + 1 };
    case 'DECREMENT':
      return { value: state.value - 1 };
    default:
      return state;
  }
}
class Counter extends Component {
  state = counter(undefined, {});
  dispatch(action) {
    this.setState(prevState => counter(prevState, action));
  }
  increment = () => {
    this.dispatch({ type: 'INCREMENT' });
  };
  decrement = () => {
    this.dispatch({ type: 'DECREMENT' });
  };
  render() {
    return (
      <div>
        {this.state.value}
        <button onClick={this.increment}>+</button>
        <button onClick={this.decrement}>-</button>
      </div>
    )
  }
}

Nota che abbiamo appena usato Redux senza eseguire npm install. Oh!
Dovresti farlo con i tuoi componenti statefull? Probabilmente no. In realtà, a meno che tu non abbia un piano per sfruttare questo ulteriore indiretto. Avere un piano, nel nostro gergo, è fondamentale.
La libreria Redux è un insieme di aiutanti per il montaggio di riduttori in un oggetto di archiviazione globale. Puoi usarlo con o senza moderazione.
Ma se lo usi, assicurati di ottenere qualcosa in cambio...
Articolo originale de Dan Abramov
https://medium.com/@dan_abramov/you-might-not-need-redux-be46360cf367#.k0dntcu9w
tradotto dall'inglese da JS Staff
[tipo separatore=”” size=”” icon=”stella”] [actionbox color=”default” title=”” description=”JS-REPUBLIC è una società di servizi specializzata nello sviluppo di JavaScript. Siamo un centro di formazione riconosciuto. Trova tutta la nostra formazione tecnica sul nostro sito partner dedicato alla Formazione” btn_label=”La nostra formazione” btn_link=”http://training.ux-republic.com” btn_color=”primary” btn_size=”big” btn_icon=”star” btn_external =”1″]