Le librerie e i framework JavaScript più conosciuti

JavaScript (abbreviato JS) è un linguaggio di scripting orientato agli oggetti che permette di visualizzare i contenuti dinamici HTML nel browser, ma viene anche utilizzato per la programmazione funzionale e procedurale. JavaScript è composto da oggetti predefiniti (elementi con specifiche proprietà o metodi e funzioni) che consentono l’accesso ad una pagina, anche se risultano complessi da usare. Molti comandi utili sono ormai stati raccolti in diverse librerie JavaScript (in inglese “JavaScript Libraries”) e framework, cioè degli strumenti che facilitano il lavoro di programmazione. Vi presentiamo quelli più conosciuti.

Libreria vs. framework

Nonostante vengano spesso usati come sinonimi, i termini “libreria“ e “framework“ hanno in realtà significati diversi. Nei paragrafi seguenti vi spieghiamo meglio in cosa consistano le loro differenze.

Libreria

Nel campo della programmazione una libreria è sostanzialmente una libreria di programmi, indipendentemente da quali comprenda. Le librerie contengono sempre dei sottoprogrammi che hanno delle funzioni per facilitare il lavoro di programmazione. Al contrario di un framework, una libreria viene sviluppata per un uso specifico e possiede per questo delle funzioni adatte al software di riferimento. Ad esempio si utilizza la libreria JavaScript D3.js per la visualizzazione dei dati, così da poter realizzare sia piccole tabelle, diagrammi e statistiche che rappresentazioni grafiche complesse (comprensive di animazioni e altre possibilità di interazione).

Le librerie sono sempre integrate in un software che è in grado di accedere alle funzioni di cui ha bisogno, quando necessario. Per questo funzionano solo all’interno di un programma e non possono essere eseguite in maniera autonoma.

Framework

Anche un framework (traducibile come “intelaiatura“ o “struttura”) non è un programma autonomo, ma appare piuttosto come un tipo particolare dilibreria standard (composta da una collezione di classi e funzioni). Un framework si presenta come la struttura di base di un’applicazione e determina il processo di sviluppo. Esistono precisi modelli con diverse funzioni (spesso sotto forma di più librerie) e si utilizzano per lo sviluppo di nuovi programmi autonomi. Un esempio al riguardo è il framework Zend per PHP, utilizzato nel software per l’e-commerce di Magento e dallo strumento di analisi Piwik.

Inversione del controllo

Un’altra differenza tra framework e libreria consiste nel controllo. Nelle librerie i programmatori accedono al codice attraverso un’interfaccia di programmazione, invece i framework eseguono un’inversione di controllo (in inglese “Inversion of Control”): il codice viene inserito in strutture predefinite del framework e richiamato quando richiesto. In sintesi si può dire che le librerie vengono utilizzate dal programma, mentre un framework gli dà istruzioni.

Librerie e framework JavaScript

JavaScript è sostanzialmente un linguaggio di programmazione semplice, particolarmente adatto per essere utilizzato dal browser. Delle complicazioni sorgono al momento di utilizzare un’interfaccia per il sito, cioè il DOM (Document Object Model)che si appoggia ai framework e alle librerie JavaScript, volte ad agevolare il compito degli sviluppatori. Nei prossimi paragrafi vi presentiamo le estensioni JavaScript disponibili gratuitamente.

Le librerie JavaScript più conosciute

Le librerie JavaScript sono dei codici riutilizzabili attraverso i quali vengono assegnate proprietà e funzioni specifiche per un sito. La libreria JavaScript più famosa è jQuery, che offre molte funzioni utili, ma ve ne sono anche altre.

jQuery

La libreria completa jQuery è quella più utilizzata e conosciuta, dal momento che il codice può essere scritto per tutti i browser e vengono creati molti plug-in. La libreria open source è una componente essenziale di molti CMS come WordPress, Drupal o Joomla!. jQuery serve a semplificare la gestione degli elementi DOM e presenta diverse funzioni per questo scopo: con i selettori del CSS3 si possono selezionare facilmente e manipolare gli elementi del sito. Inoltre questa libreria è particolarmente apprezzata perché permette di integrare richieste Ajax, cioè delle richieste HTTP dove non è necessario ricaricare la pagina.

Vantaggi Svantaggi
Supporto Ajax Può essere molto lento rispetto al CSS
Molto diffuso Si avvicina a uno “Spaghetti code“
Ampia libreria Per via delle nuove funzioni di JavaScript è diventato in parte superfluo
Facile da utilizzare  
Innumerevoli plug-in  

jQuery UI

jQuery UI è un’estensione libera per jQuery e serve alla realizzazione e gestione di un’interfaccia utente (in inglese “User Interface” o abbreviata “UI”), per esempio per le pagine web o web app. È particolarmente adatta per realizzare effetti semplici ed elementi interattivi; infatti jQuery dispone di diverse funzioni per creare elementi interattivi (come drag&drop, ingrandimento e ridimensionamento degli elementi del sito, ecc.), animazioni, effetti e widget (come autocompletamento, slider, datepicker, ecc.). Grazie all’editor grafico ThemeRoller è possibile creare dei propri temi, ma anche utilizzare quelli già disponibili e adattarli; la struttura modulare permette di implementare solo le componenti necessarie.

Vantaggi Svantaggi
Facile da usare grazie ai widget Sviluppo lento
Editor grafico ThemeRoller Richiede jQuery

Dojo Toolkit

Dojo Toolkit è adatto soprattutto per la realizzazione di applicazioni web e contenuti dinamici. Rientrando tra le librerie JavaScript storiche, che hanno ancora un certo peso sul mercato, presenta svariate funzionalità e le componenti più importanti del toolkit sono il programma principale (Dojo) e Dijit, un’interfaccia utente già preimpostata. Inoltre si possono integrare degli elementi nel sito da creare grazie ai widget già pronti. Anche Dojo può usare sia DOM sia Ajax.

Vantaggi Svantaggi
Facile da usare grazie ai widget Difficile da usare
Supporto Ajax Sviluppo lento
Libreria ampia e modulare  

React

React è stato utilizzato per la prima volta nel 2011 nel news feed di Facebook e nel 2013 è stata rilasciata la versione open source. Si tratta di un’altra libreria di JavaScript che permette di creare un’interfaccia utente. La particolarità di questa libreria risiede nel fatto che si può utilizzare nei client delle pagine web, ma anche sul server o per lo sviluppo delle app. Ciò è riconducibile all’uso di un DOM virtuale che consente di testare le applicazioni web in modo più facile.

Inoltre React è apprezzato da molti sviluppatori per via del suo “One direction data flow”, quindi per il traffico dati a senso unico: questa tecnologia garantisce un codice stabile, impedendo che le modifiche del codice di livello inferiore influiscano su quello di livello superiore. Le modifiche possono avere delle ripercussioni solo nell’altra direzione.

Vantaggi Svantaggi
DOM virtuale Difficile da usare
Traffico dati a senso unico (one way data flow)  
Rendering lato server  
Utilizzabile per le app sui dispositivi mobili  

Zepto

Zepto è un vero peso piuma: infatti il fatto che jQuery si contraddistingue soprattutto per le sue molte funzioni spaventa alcuni sviluppatori. La libreria JavaScript più conosciuta risulta troppo ingombrante per alcuni utenti. Il minimalista Zepto si presenta così molto più leggero, dovrebbe perciò caricare più velocemente e richiedere meno spazio, motivo per cui è utilizzato soprattutto nelle app per i dispositivi mobili. Per mantenere al minimo la quantità dei file, Zepto riduce ad esempio la compatibilità con i browser più datati. Si deve ricorrere a dei moduli aggiuntivi anche per permettere l’uso di Ajax e delle animazioni.

Vantaggi Svantaggi
Molto leggero Non supporta le versioni più datate dei browser
Facile da utilizzare Uso di Ajax e delle animazioni solo con moduli aggiuntivi
  Pochi vantaggi rispetto a jQuery

CreateJS

Non solo una, ma più librerie allo stesso tempo: CreateJS è una suite composta da quattro diverse librerie: EaselJS (per i grafici e l’interattività), TweenJS (per le animazioni), SoundJS (per i suoni) e PreloadJS (per il precaricamento). Sono autonome e indipendenti tra di loro, quindi se ad esempio in un progetto serve solo una libreria, non si devono per forza implementare tutte e quattro. In più vengono messi a disposizione alcuni strumenti che semplificano il lavoro con le librerie JavaScript. In particolare CreateJS si concentra sullo sviluppo di applicazioni HTML5 e Flash. Infatti il team di questa libreria lavora a stretto contatto con Adobe, per cui ci sono anche tool che garantiscono un funzionamento ideale della suite con i prodotti di Adobe.

Vantaggi Svantaggi
Librerie indipendenti Piccola community
Strumenti aggiuntivi  
Integrazione con Adobe Animate  

Le librerie JavaScript a confronto

  jQuery jQuery UI Dojo Toolkit React Zepto CreateJS
Anno di rilascio 2006 2007 2005 2013 2010 2012
Maintainer JS Foundation JS Foundation Dojo Foundation Facebook Thomas Fuchs gskinner.com
Licenza MIT MIT BSD/AFL MIT MIT MIT
Contributors su GitHub ca. 270 ca. 300 ca. 100 ca. 1.100 ca. 180 ca. 40
Particolarità Libreria più conosciuta Attenzione particolare per la GUI Attenzione particolare per le web app DOM virtuale Minimalista Integrazione con Adobe Animate

I framework JavaScript più popolari

Esistono senza dubbio più librerie che framework JavaScript. In particolare questi ultimi sono maggiormente adatti per applicazioni web complesse, quindi affidandosi ai concetti e ai comandi del framework scelto, gli sviluppatori lavorano in modo molto più efficace.

AngularJS

Questo framework creato da Google dispone della più grande community tra i framework JavaScript. Analogamente al suo concorrente principale, la libreria React di Facebook, AngularJS serve per realizzare Single Page Application, cioè web app costituite solo da un documento HTML. Grazie al modello MVVM (Model View ViewModel) possono essere sviluppate delle applicazioni che intendono realizzare un’interazione con gli utenti. AngularJS è un’applicazione lato client, che si basa su jQuery Lite, una variante compatta della famosa libreria JavaScript jQuery. Una curiosità: i produttori del framework JavaScript lo classificano piuttosto (in maniera semi-seria) come MVW, cioè Model-View-Whatever.

Vantaggi Svantaggi
Community molto grande Sostituito da Angular
Parte dello stack MEAN Difficile da usare inizialmente

Angular

Angular, chiamato a volte anche Angular 2, è il successore di AngularJS, pensato sempre principalmente per lo sviluppo di Single Page Application. Tuttavia Google ha apportato molte modifiche radicali nella seconda versione: la differenza maggiore è che per la programmazione non viene più utilizzato JavaScript, ma TypeScript. Ciò nonostante non risulta nessuna limitazione diretta per la programmazione JS, poiché il linguaggio di programmazione di Microsoft si basa su JavaScript e lo ha quindi incorporato. Inoltre grazie ai miglioramenti fatti risulta ora facile lo sviluppo delle applicazioni su Angular partendo da diverse piattaforme (desktop, Mobile, tablet).

Vantaggi Svantaggi
Più possibilità grazie a TypeScript Difficile migrazione da AngularJS a Angular
Sviluppo possibile su più piattaforme Ancora più difficile da utilizzare rispetto al suo predecessore

Ember.js

Anche Ember.js è un framework lato client, utilizzato per realizzare Single Page Application, ma con cui si possono generare anche applicazioni per il desktop. Una differenza con AngularJS è il fatto che i creatori di Ember.js coinvolgono molto la community nel processo di sviluppo del framework e discutono pubblicamente insieme a loro le modifiche più significative apportate, prima di attuarle. Ember.js si definisce un framework con cui creare delle web app ambiziose, per questo si indirizza prima di tutto agli sviluppatori che hanno già dimestichezza nella creazione di applicazioni web.

Vantaggi Svantaggi
Sviluppato grazie alla community open source Molto impegnativo per i principianti
Si può utilizzare anche per le applicazioni desktop  

Vue.js

Anche Vue.js è un framework JavaScript per lo sviluppo delle Single Page Application, che ricorda Angular e React. Gli sviluppatori di questo progetto ambizioso e relativamente nuovo hanno creato Vue.js con l’intento di renderlo sin dall’inizio più facile per i principianti rispetto agli altri framework. Così è ad esempio possibile integrare i template nell’HTML. Inoltre Vue.js dovrebbe essere anche molto più flessibile rispetto ad altri framework che mantengono solitamente un’impostazione rigida.

Vantaggi Svantaggi
Facile da utilizzare Poco complesso
Supporta HTML & CSS Piccola community rispetto agli altri framework
Possibilità di sviluppo flessibili  

Meteor

Meteor, chiamato a volte MeteorJS, è un framework JS particolarmente adatto per lo sviluppo su diverse piattaforme (in inglese “Cross Platform Development”). Consente agli sviluppatori di creare con lo stesso codice sia applicazioni web sia app per i dispositivi mobili. Un altro vantaggio consiste nel fatto che le modifiche al codice possono essere inoltrate direttamente ai client grazie al proprietario Distributed Data Protocol (DDP). A partire dal framework gratuito i produttori di Meteor offrono anche Galaxy, una piattaforma a pagamento.

Gli sviluppatori possono utilizzare il servizio cloud per pubblicare e gestire i propri progetti. Questo framework JavaScript funziona su una base Node.js ed è quindi anche molto utile disporre di conoscenze sull’ambiente di sviluppo per lavorare con Meteor. Qui il back end e il front end si fondono senza dover cambiare il linguaggio: si tratta di un concetto rivoluzionario che però non si è ancora affermato come standard.

Vantaggi Svantaggi
Sviluppo possibile su più piattaforme Funziona solo con MongoDB e non con altri tipi di database
Piattaforma di hosting Galaxy Necessario cambiamento del back end
Si può combinare con Angular, React e altri framework/librerie Problemi di performance e con i motori di ricerca

I framework JavaScript a confronto

  AngularJS Angular Ember.js Vue.js Meteor
Anno di rilascio 2009 2016 2011 2014 2012
Maintainer Google Google Ember Core Team Evan You Meteor Development Group
Licenza MIT MIT MIT MIT MIT
Contributors su GitHub ca. 1.600 ca. 570 ca. 700 ca. 700 ca. 370
Architettura MVVM/MVW MVC MVVM MVVM MVVM
Particolarità Utilizzabile anche per app per i dispositivi mobili e desktop Utilizzabile anche per app per i dispositivi mobili e desktop Utilizzabile anche per applicazioni per il desktop Facile da utilizzare Combina back end e front end

Strumenti utili per diversi scopi

Framework e librerie possono essere dei validi aiuti per alleggerire il lavoro con JavaScript, anche se quelli presentati qui sono solo una selezione tra i molti strumenti disponibili. Per informarsi sugli altri framework, librerie e plug-in JavaScript, si consiglia di consultare GitHub e il sito www.javascripting.com, dove potete trovare le estensioni JavaScript più adatte ai diversi scopi.


Abbiamo una proposta per te:
Web hosting a partire da 1 €/mese!

Dominio gratis
Certificato SSL Wildcard incluso
Assistenza clienti 24/7
A partire da 1 €/mese IVA escl. per un anno,
poi 8 €/ mese IVA escl.