Gulp e Grunt: le caratteristiche dei due task runner

I web developer non si confrontano soltanto con problemi complessi, ma devono spesso eseguire compiti abbastanza noiosi, ripetitivi e ricorrenti. Operazioni come compilare Less e SCCS nei file CSS, oltre a essere alquanto snervanti, comportano uno spreco di tempo prezioso. Per alleggerire il compito degli sviluppatori e automatizzare i processi sono stati sviluppati i cosiddetti task runner: in particolare esistono diverse applicazioni per gli ambienti JavaScript, tra cui le più popolari sono Grunt e Gulp. Ma cosa rende questi due task runner per JavaScript così speciali e in quali aspetti si differenziano?

Un task runner è un programma in grado di automatizzare uno o più processi che altrimenti dovrebbero essere eseguiti manualmente. La sua funzione è quindi preziosa, specialmente nel caso di quei task che devono essere ripetuti più e più volte. Ottimizzando il workflow, un task runner garantisce agli sviluppatori più tempo a disposizione per lo svolgimento di altri compiti. Le differenze principali tra i diversi task runner risiedono sostanzialmente nel modo in cui sono programmati e funzionano. In generale gli utenti hanno sempre la possibilità di definire quali task dovranno essere eseguiti dal tool e quali no.

Nel campo dello sviluppo web è di grande importanza l’aiuto di questi strumenti: basti pensare alla sfida quotidiana che i front end developer devono affrontare quando eseguono processi semplici ma ripetitivi come la compilazione dei fogli di stile di un preprocessore CSS (Less, Sass, SCSS) all’interno di file CSS già pronti o la minimizzazione del codice JavaScript. Ma la semplificazione del workflow appare del tutto necessaria anche se si considera quanto tempo richiede testare la funzionalità dei singoli moduli, spesso ben più di quello effettivamente a disposizione. I task runner per JavaScript basati su Node.js si sono imposti come soluzione per automatizzare i processi. Inoltre le possibilità di automazione dei singoli programmi sono ampliate da numerosi plug-in.

Nell’ambiente JavaScript esistono diversi task runner che si differenziano tra loro in base al modo di inizializzazione dei processi di automazione. Da un lato ci sono i programmi che hanno già a disposizione il codice necessario per avviare il relativo processo: in questo caso l’utente si limita a definire quale task delegare, senza occuparsi in prima persona della programmazione del codice. Dall’altro ci sono i task runner che puntano sulla programmazione, offrendo all’utente molta più libertà nella creazione dei propri script di automazione.

A parte Broccoli.js e Brunch, le applicazioni più popolari sono Gulp e Grunt. Di seguito ci occupiamo delle caratteristiche di entrambi, concentrandoci sulle loro somiglianze e differenze.

Lo sviluppatore JavaScript Ben Alman ha pubblicato nel 2012 il task runner Grunt, sul quale da allora ha continuato a lavorare insieme a un piccolo team. Il codice del programma è distribuito con Licenza MIT e può essere scaricato dal sito ufficiale, oltre a essere utilizzabile gratuitamente sulla piattaforma per sviluppatori GitHub. Come tutti i tool della stessa tipologia, Grunt si basa su Node.js e dispone di una propria interfaccia a linea di comando (grunt-cli), che come il task runner stesso può essere installata tramite il gestore di pacchetti npm (Node Package Manager).

Per integrare Grunt all’interno di un progetto web, bisogna prima aggiungere due file alla root del progetto. Di norma il file package.json contiene tutti i metadati dei task automatizzabili come il nome, la versione, la licenza e le relative dipendenze. Nel Gruntfile, disponibile in JavaScript (gruntfile.js) o CoffeeScript (gruntfile.coffee), è contenuto il codice che viene usato effettivamente per integrare e configurare i moduli individuali del task. I moduli, chiamati anche plug-in, possono essere installati attraverso il già citato gestore di pacchetti npm.

La plug-in directory contiene più di seimila task con scopi diversi, come ad esempio grunt-contrib-clean (pulizia di file e cartelle), grunt-contrib-cssmin (minimizzazione CSS) o grunt-contrib-connect (avvio di un web server locale). Molti di questi plug-in sono semplicemente interfacce di tool autonomi: grunt-contrib-uglify permette ad esempio di controllare il minimizzatore UglifyJS del Gruntfile.

Oltre alla possibilità di modificare o estendere task esistenti, gli sviluppatori esperti possono anche creare i propri moduli di automazione per adattare il task runner alle proprie esigenze.

Nel luglio 2013 la società americana di software Fractal Innovations ha lanciato sul mercato, in collaborazione con la comunità GitHub, la prima versione del task runner gratuito Gulp. Al pari di Grunt, il programma è distribuito con licenza open source MIT, è basato sulla piattaforma JavaScript Node.js e utilizza il gestore di pacchetti npm. Anche per quanto riguarda la struttura, Gulp non differisce molto da Grunt: si tratta sempre di un tool a riga di comando con interfaccia utente gulp-cli. Di norma vengono utilizzati i file di configurazione package.json e il Gulpfile (gulpfile.js), che elenca le possibili operazioni. Aggiungendo entrambi alla web directory si può utilizzare il task runner per l’ottimizzazione del workflow.

Il Gulpfile, che contiene esclusivamente JavaScript, riassume le singole operazioni in modo che possano essere eseguite attraverso il modulo stream di Node.js. La maggior parte dei singoli processi stream si svolge nella RAM, prima che i risultati vegano scritti alla fine nei rispettivi file. Questa è la ragione per cui le prestazioni del task runner sono generalmente eccellenti. Dal momento che le operazioni vengono programmate sin dall’inizio, ma non configurate, la conoscenza di JavaScript e Node.js è un requisito fondamentale per l’utilizzo di Gulp. Questo significa più libertà per i professionisti, ma allo stesso tempo una maggiore possibilità di commettere errori.

Anche per Gulp esistono molti task già pronti sotto forma di plug-in. La directory ufficiale su gulpjs.com contiene più di tremila estensioni come gulp-jekyll (compilazione di progetti Jekyll), gulp-php-minify (ottimizzazione del codice PHP) o gulp-cssmyicons (conversione in CSS di icone SVG).

A prima vista Gulp e Grunt non sembrano molto diversi l’uno dall’altro. Entrambe le applicazioni sono distribuite con Licenza MIT, ragione per cui il codice sorgente è open source; entrambe sono controllabili attraverso una riga di comando e dispongono a questo scopo di una propria interfaccia già installata; inoltre entrambi i task runner utilizzano npm come gestore di pacchetti. Grazie all’ampia directory di plug-in, sia Gulp che Grunt sono facilmente in grado di automatizzare un gran numero di operazioni. Nel caso non sia disponibile l’estensione per un determinato task, con entrambi i tool è possibile programmarla: per questo motivo, il loro utilizzo presuppone la conoscenza di JavaScript e Node.js.

Tuttavia, se Gulp utilizza soprattutto il modulo stream di Node.js, Grunt al contrario utilizza principalmente il modulo fs (file system), ed è proprio sotto questo aspetto che i due programmi si differenziano in maniera significativa: Grunt è decisamente orientato ai file e crea file locali e temporanei mentre esegue le operazioni, mentre Gulp gestisce i processi tramite la RAM e li scrive immediatamente sul file di destinazione, presentando un vantaggio in termini di velocità nel compiere le operazioni.

La seconda differenza fondamentale risiede nelle diverse concezioni alla base dei due software. La programmazione di Grunt fornisce all’utente una direzione precisa, nella quale i task pronti sono già definiti e devono soltanto essere configurati. Gulp al contrario lascia molto più spazio alla programmazione personalizzata dell’utente, poiché mette a sua disposizione soltanto i moduli individuali. Questo aspetto facilita da un lato la comprensione del background e delle connessioni, ma dall’altro richiede all’utente un impegno maggiore. Possiamo dire che Gulp dimostra tutte le sue qualità con l’aumentare delle dimensioni dei progetti, ragion per cui è ormai diventato la prima scelta per molti. Presentando tuttavia meno difficoltà di utilizzo, Grunt ha ancora buone ragioni per essere impiegato in progetti più piccoli e facili da gestire.