I migliori 5 Frameworks Javascript Open Source

Javascript framework

Quando si tratta di iniziare un nuovo progetto, piccolo o grande che sia, è sempre una buona idea darsi una guardata intorno per capire cosa c’è di nuovo oppure cosa, nel frattempo, ha guadagnato consenso. Ma soprattutto perché! Alcuni sono snelli, altri sono potenti, con altri ancora si possono realizzare prodotti di gran pregio. Vediamo insieme di orientarci al meglio dando uno sguardo agli aspetti salienti di alcuni Framework Open Source.

La programmazione web si sta spostando pesantemente e velocemente dai server ai client, allo stesso modo di quanto è successo, alcuni di voi ricorderanno, qualche lustro fa con le applicazioni desktop. I client offrono una potenza di elaborazione e prestazioni grafiche di tutta eccellenza ed i server sono velocissimi a rendere disponibili i dati. Ma il vero motivo è la standardizzazione offerta dall’implementazione dell’HTML5 e del CSS3 in quasi tutti i web browser desktop e mobili.

Ma, per parafrasare una vecchia pubblicità, tutto questo è inutile senza controllo!! Per questo oggi vediamo i 5 migliori Framework Javascript Opensource sui quali soffermarsi prima di avviare un nuovo progetto.

Mi preme sottolineare che questa non è una classifica, nonostante tutte le migliori intenzioni, e nonostante le mie personali preferenze, ognuno di questi prodotti software ha pro e contro che dipendono fortemente da ciò che si vuole realizzare e dalle proprie conoscenze.

Non di meno sono tutti, nessuno escluso, una soluzione migliore che scrivere codice JS nudo e crudo, anche se con l’aiuto di insostituibili librerie come jQuery. 

 

Backbone.js

Backbone

Image credits

Il primo Framework che andiamo a segnalare è Backbone.js, progetto iniziato nel 2010 e con una comunità estremamente estesa. E’ alla base di molte applicazioni che usate giornalmente come Twitter, Foursquare e la versione mobile di LinkedIn. E’ forse il Framework più leggero da caricare, con soli 6.4 kB nella versione “minificata” e compressa.

In Backbone i dati sono rappresentati come modelli (Models) ed organizzati in collezioni (Collections), mentre la visualizzazione è demandata alle View con la gestione di eventi di binding. Backbone manca del concetto di Controller, perché il lavoro svolto tende ad essere integrato nella View stessa.

Pro

  • Curva di apprendimento leggera per chi già lavora in JS e jQuery
  • Estremamente piccolo da scaricare, buono anche per applicazioni molto light
  • Progettato per coesistere tranquillamente con altre librerie

Contro

  • Ha la struttura di base di un Framework ma c’è molto codice da scrivere anche per operazioni semplici
  • Per aumentarne l’efficacia bisogna ricorrere ad altre librerie e la complessità aumenta

 

EmberJS

Image credits

E’ un Framework giovane, rilasciato nel corso del 2011 e con una forte community di utenti. EmberJS è alla base di applicazioni come Groupon, Square, Discourse e Zendesk e, rispetto a Backbone, ha una dimensione di download abbastanza sensibile, di circa 69 kB minificata e compressa.

Ma la differenza si sente nella quantità di codice che dobbiamo scrivere. Mentre Backbone.js è un Framework a più basso livello, Ember esegue molte operazioni in modo automatico, quali ad esempio gli aggiornamenti della View al cambio dei valori nel modello. Questa operazione di Data-bind è estesa anche a proprietà collegate, che vengono tenute in sincronizzazione dal Framework. 

Inoltre il Framework ha integrati servizi di sincronizzazione fra dati remoti e locali e fra dati locali ed il localStorage del browser. Questo significa un significativo boost nella realizzazione di applicazioni web off-line. 

Pro

  • Potente Data-binding, incredibili risultati con poco codice
  • Gestione integrata della sincronizzazione remota e localStorage
  • Curva di apprendimento media per utenti neofiti
  • Ottimo per applicazioni multi-pagina

Contro

  • Il rendering è basato sull’engine Handlebars, per cui è necessario apprenderne le basi

 

Knockout.js

Knockout

Image credits

Anche Knockout.js si può annoverare tra i Framework leggeri, essendo scritto principalmente per implementare una architettura Model-View-ViewModel dove il cuore è il Two-way-binding tra modello e view.

E’ un Framework molto semplice da usare ed implementare, mantenendosi estremamente compatibile con tantissime librerie javascript. Inoltre è estremamente veloce nella gestione della sincronizzazione tra view e model, grazie all’implementazione di un grafo di dipendenza tra i campi del modello.

Non prevede però alcuna gestione del routing e quindi può risultare più complicata la realizzazione di web application singola pagina.

Pro

  • Molto semplice da implementare e molto leggero nel caricamento
  • Data-binding molto efficiente e veloce
  • Non crea problemi di compatibilità con le librerie javascript
  • Supporta IE6 (ed è tutto dire)

Contro

  • Non è la prima soluzione per realizzare app a singola pagina

 

AngularJS

AngularJS

Image credits

Dei Framework visti finora, AngularJS è quello che richiede allo sviluppatore un vero e proprio cambio di prospettiva. Paradossalmente è forse più semplice iniziare a lavorare con Angular per un neofita della programmazione web di quanto lo sia per un esperto. E’ un Framework molto stabile, ben documentato, con una fortissima community ed è stato scelto per la realizzazione di applicazioni Google e Nike, di siti web come MSNBC, The Guardian, Huffington Post. 

Una delle sue caratteristiche di punta è il Two-way-binding automatico, che consente di sincronizzare in modo bidirezionale il modello dati con la view. Ma porta con se concetti nativi per la scrittura modulare dell’applicazione e, soprattutto, implementa pattern che consentono la testabilità automatica del codice scritto.

Purtroppo, a causa del modo in cui in AngularJS viene attuata la gestione delle view, molti componenti javascript possono non essere compatibili, oppure necessitare della scrittura di apposite direttive per poter essere usati.

Pro

  • Obbliga ad una strutturazione modulare e a componenti dello sviluppo del codice
  • Ottimo per applicazioni web complesse e applicazioni a singola pagina
  • Curva di apprendimento media per i neofiti 
  • Implementa pattern che consentono nativamente la testabilità del codice

Contro

  • Richiede allo sviluppatore di pensare in modo “Angular” e questo può essere percepito limitante per sviluppatori più avvezzi alla manipolazione diretta del DOM
  • Alcuni componenti javascript comuni possono non funzionare con AngularJS
  • Al momento è solo parzialmente compatibile con jQuery Mobile

 

Batman.js

BatmanJS

Image credits

Il vero e proprio bebè di questa rassegna è Batman.js, assolutamente da non pronunciare con Er davanti. Attivamente mantenuto da Shopify, Batman.js ha un approccio molto vicino a quello di AngularJS ma utilizza CoffeeScript come linguaggio di sviluppo. Saranno certamente contenti gli sviluppatori Ruby on Rails.

Vi sono molte semplificazioni rispetto ad Angular, ma questo significa anche maggior velocità di protopizzazione e di avvio del progetto. Ha comunque integrate gestione del routing, data-binding, singletons, gestione REST remota e persistenza dei dati sul localStorage.

Comunque, mantiene come AngularJS un approccio strutturato e di scollamento del codice dall’interfaccia utente, cosa che semplifica la gestione di un progetto complesso.

Pro

  • Approccio strutturato ed organizzato come AngularJS
  • Sviluppo del codice client in CoffeeScript
  • Nessuna dipendenza esterna come, ad esempio, jQuery
  • Gestione del routing per app singola pagina

Contro

  • Progetto molto giovane, con community in evoluzione e documentazione non ancora all’altezza degli altri Framework
  • Alcuni componenti javascript comuni possono non funzionare con Batman.js
  • Non ha il concetto dei template parziali

 

Main image credits

One Response

  1. Antonello 4 aprile 2014

Leave a Reply