React JS: difficile fare di meglio
Negli ultimi anni ReactJS ha dato del filo da torcere a tutta la concorrenza del front-end in popolarità, soprattutto grazie all’estrema attenzione per la semplicità di sviluppo grazie all’innovazione data da JSX.
Molto di più di una semplice libreria
Uno sviluppatore alle prime armi potrebbe percepirla come una semplice libreria Javascript. In realtà, ReactJS è molto di più. Il framework è in grado di dare supporto ad applicazioni web che manipolano una grande mole di dati dinamici rendendola la base ideale per la realizzazione di app mobile e single-page application. Inizialmente concepita per gestire il news feed del popolare social network Facebook e per realizzare la versione web di Instagram, ReactJS viene ormai utilizzata come libreria dalla maggioranza degli sviluppatori. Risulta tra i repository preferiti su GitHub, scaricato più di 6,6 milioni di volte ogni settimana. Un numero sorprendente, ma non troppo, se si considerano le performance che il framework offre.
Una soluzione vantaggiosa: ecco perché
I sondaggi parlano chiaro: ReactJS occupa le primissime posizioni nel mercato dello sviluppo Front-End. Ma effettivamente quali sono i vantaggi di utilizzare ReactJs? Perché un’azienda dovrebbe scegliere ReactJS?
Partiamo dal principio che quando uno sviluppatore è bravo e conosce le best practice ogni tecnologia è valida. Ma bisogna considerare anche la scalabilità.
ReactJS rende possibile ottimizzare tutti i componenti, consentendo agli sviluppatori di includere nuove parti nello sviluppo delle loro applicazioni. La componente principale è JSX, ovvero un’estensione della sintassi JavaScript che amplia le funzionalità di ES6 (ECMAScript 2015), combinando logica e markup JS in un unico componente.
React evita inoltre l’uso di two-way data binding -flusso dati bidirezionale- e l’aggiornamento in cascata dell’albero del DOM, introducendo il concetto di “DOM Virtuale” che permette un notevole miglioramento delle prestazioni dell’applicativo nel processo di rendering. Utilizzando ReactJS, lo sviluppatore di app può controllare l’avanzamento tempestivo dell’intero progetto.
ReactJS: partiamo dalle basi
ReactJS, come anche la sua versione per lo sviluppo Mobile React-Native, consente di suddividere l’intero progetto in componenti separati, grazie alla caratteristica modulare. Questa modularità ha un potenziale inizialmente nascosto, ma che è diventato palese negli anni, ovvero l’altissima scalabilità.
In sintesi, tutto ciò consente un continuo riutilizzo del codice, a partire dalla scalabilità della componentistica sviluppata fino ad arrivare (per pochi) anche a ipotesi di riutilizzo di interi flussi e grandi porzioni di codice (come, ad esempio, è reso possibile da FlowerJS).
Una precisazione diplomatica
Gli amanti di Vue e Angular potrebbero sostenere che queste siano tecnologie simili e altrettanto valide. Questo è innegabile, infatti anche noi di Stackhouse ne facciamo uso.
Però credo anche che con l’immissione di Typescript nella stesura del Codice React si sia raggiunto l’apice della modernizzazione dello sviluppo Front-end odierno. A confronto con altri framework, ReactJS è più intuitivo e di facile utilizzo, mentre permette comunque livelli di scalabilità che le altre tecnologie similari non raggiungono.
Ogni rosa ha le sue spine, anche ReactJS
Alcune complessità ci sono anche per ReactJS. Il framework, infatti, ha tanti modi di essere utilizzato male. Come ovviare a queste problematiche? Semplicemente, bisogna seguire attentamente le best practice e farne un uso consono:
- Ingegnerizzare la creazione di componenti in modo che siano indipendenti e riutilizzabili;
- Usare un linter;
- Scrivere il codice in modo che sia testabile (passaggio troppo spesso ignorato);
- Non inserire troppa logica nei componenti e demandare il più possibile ad un gestore come Redux;
- Usare typscript, defaultProps e propTypes ormai appaiono troppo deboli (ma sempre valide);
- Strutturare i file;
- Preferire componenti funzionali alle classi;
- Imparare ad usare bene useMemo e useCallback;
- Spostare lo stato nel punto più vicino possibile a dove viene consumato;
- Non abusare di effetti in generale (useEffect ex).
Ancora oggi mi capita di scorgere in alcuni progetti “componenti enormi”, figli della visione monolitica dello sviluppo del software e soprattutto figli di un’impostazione sbagliata al framework di React, che prevede un’ingegnerizzazione del componente molto precisa al fine della sua renderizzazione.
Esperti di ReactJS
Il livello della community internazionale altissimo permette di potersi aggiornare e di aggiornare la tecnologia con poche difficoltà.
Tra le più grandi aziende che utilizzando React troviamo ai primi posti Facebook, Instagram, Whatsapp, Netflix, Dropbox e perfino il New York Times.
In tutto questo ci siamo noi, Stackhouse, che nel 2014/15 e senza alcun appiglio di community o circa abbiamo creduto in questa tecnologia. Un’intuizione che con il tempo si è trasformata nella nostra grande fortuna. Dopo anni di sviluppi per grandi realtà a livello industriale, ormai niente ci spaventa su ReactJS. Tutti i problemi che potevano esistere li abbiamo approfonditi e risolti tempo fa.
Nel corso della nostra storia, ci siamo innamorati sempre più del nostro lavoro e delle tecnologie che ci risolvono i problemi invece di crearli. Forse, potremmo parlare di una vera e propria Obsession… Ma forse è un po’ presto per farvi scoprire questo lato di noi.
Stay tuned, e scegliete ReactJS! Non ve ne pentirete.