AngularJS e React sono i due framework più popolari per lo sviluppo di interfacce web. Che cosa abbiamo imparato lavorando con entrambi.
[Aggiornamento: a due anni di distanza dalla pubblicazione di questo post, lo scenario dei cross-platform framework è profondamente murato. Alle librerie JavaScript si sono affiancate tecnologie che permettono lo sviluppo di app semi-native. Per un quadro più aggiornato, vedete il nostro post React Native e Flutter: così evolve il mondo dei cross-platform framework]
Il confronto fra AngularJS e React, le tecnologie oggi più popolari per lo sviluppo di applicazioni web e mobile web, non è mai stato così acceso. Ciascuna delle due ha paladini e detrattori, anche se in generale React ha conquistato negli ultimi mesi molti nuovi simpatizzanti. C’è addirittura chi sostiene che AngularJS abbia fatto il suo tempo e che il futuro sia tutto per React.
Alle spalle delle due comunità open source, popolose e agguerrite, si muovono dei giganti. AngularJS, com’è noto, è un framework nato in casa Google, mentre React è una tecnologia di Facebook. La disfida è ai massimi livelli, insomma.
Il team di Spindox che lavora in ambito web conosce bene e impiega entrambe le tecnologie. Ecco, in breve, che idea ci siamo fatti.
Un primo ambito di confronto riguarda lo sforzo necessario per imparare a usare le due piattaforme. Da questo punto di vista React sembra vincente. Il tempo che occorre mettere in campo per raggiungere un buon livello di conoscenza della piattaforma è più breve rispetto a quello richiesto da AngularJS. Quest’ultimo non appare sempre così intuitivo, tanto da costringere talvolta all’analisi del codice sottostante. Cosa che non ci si aspetta da una libreria di componenti pronti all’uso.
Del resto AngularJS presenta un livello di astrazione più debole rispetto a React. La comprensione del modello sottostante – magari condotta attraverso il debug degli elementi della libreria – è spesso un passaggio necessario. È anche vero, tuttavia, che l’astrazione di React è meno flessibile, nonostante l’uso di mixin (classi contenenti metodi che possono essere utilizzati da altre classi senza relazioni di dipendenza).
Anche dal punto di vista delle modalità di impacchettamento React sembra vincente. Esso consente un deploy più agile del codice. Soprattutto rende più agevole continuare lo sviluppo, senza un impatto significativo sul tempo di caricamento. A tale scopo fra l’altro permette l’uso di loader come RequireJS o Webpack.
A livello di debugging il confronto si fa più complesso. Potremmo sintetizzare così: AngularJS vince sull’HTML, React su JavaScript. In ogni caso entrambe le tecnologie non offrono sempre soluzioni semplici. Talvolta riscrivere il codice è una scelta quasi obbligata.
L’ambito in cui AngularJS risulta di sicuro vincente è quello del templating. E si tratta di un ambito molto importante. AngularJS mette a disposizione specifici elementi e attributi (directive, markup, filter, form controls) da inserire nei template scritti in HTML. Il template è collegato all’informazione del modello e al controller.
In definitiva qual è la tecnologia migliore? Da molti punti di vista React supera AngularJS. In sostanza React si offre come una tecnologia più semplice da imparare e utilizzare, che presenta meno problemi e un livello di complessità inferiore. Per lo sviluppo di una mobile app o di un MVP sembra oggi la soluzione più efficace, soprattutto se si vuole raggiungere rapidamente il risultato atteso. Tuttavia per molti contesti enterprise AngularJS resta il framework giusto, anche grazie a una comunità di riferimento molto più ampia e a una storia più robusta rispetto alla libreria concorrente.
Non va poi dimenticato che Angular oggi significa due tecnologie distinte: AngularJS e Angular 2. Quest’ultima è il risultato di una riscrittura profonda del primo framework, tanto che secondo alcuni l’unica cosa in comune fra le due piattaforme sarebbe il nome. Fra l’altro sono stati eliminati scope e controller, oltre al metodo di definizione dei moduli angular.module(). Inoltre è stato introdotto il two-way data binding, che permette di riflettere i cambiamenti del modello dei dati sulla view e viceversa in modo automatico.
Senza dubbio Angular 2 ha migliorato molto alcuni aspetti di AngularJS, a livello di packaging e astrazione. Resta tuttavia notevole lo sforzo di apprendimento richiesto, specie nel confronto con React. Per un confronto al volo può essere utile la seguente tabella, realizzata da Shannon Duncan:
Un confronto molto puntuale fra Angular 2 e React è stato condotto qualche mese fa su Medium da Eric Elliott. La conclusione, comunque, è sempre quella: Angular 2 è un framework tecnicamente più ricco, tutto concepito in una logica prescrittiva; React, di contro, aiuta la vita agli sviluppatori che amano le cose semplici. E, in ogni caso, ancora non si vede un terzo player all’orizzonte.
