Se hai mai lavorato con il codice, hai sentito la frase “Keep it DRY” (” Non ripetere te stesso”). In altre parole, se devi eseguire un’attività ripetutamente, trova un modo per farlo in modo più efficiente, il che in genere significa meno codice.

Quando iniziamo a sviluppare un nuovo progetto, spesso ci troviamo a ripetere le stesse cose più e più volte–cose come l’ottimizzazione delle immagini, la minimizzazione del codice e la compilazione dei file. In alcuni casi, ci ripetevamo più volte al minuto. Il costo di tempo di queste attività si aggiunge rapidamente come apportare modifiche o creare nuovi file.

È terribilmente inefficiente. Per non parlare del fatto che aggiunge usura alle dita e ai tasti della tastiera. Task runners sono qui per aiutare!

Che cos’è un Task Runner?

I task runners fanno letteralmente proprio questo: eseguono attività. I programmatori possono specificare quali attività desiderano eseguire un task runner e farà tutto il lavoro per loro.

Prima dei task runners, se si voleva compilare Sass, eseguire Autoprefixer e quindi minimizzare il CSS risultante ogni volta che si apportava una modifica, si sarebbe stati costretti a completare ciascuna attività separatamente. Naturalmente, che sarebbe ottenere fastidioso molto veloce. Per non parlare di sprecare una quantitàgregegia di tempo ripetendo te stesso. Non e ‘ divertente.

Con un task runner, è possibile specificare le attività che si desidera completare, eseguirlo una volta, e farà tutto il lavoro per voi. Risparmiare tempo, risparmiare denaro, e salvare il mondo (forse?).

Ci sono un sacco di corridori di attività là fuori: Brunch.js, bevi.js, Broccoli.js, Torta.js, e Grugnito.js, solo per citarne alcuni costruiti in Javascript. Sì, i loro nomi suonano come qualcosa che faresti durante il tuo compleanno (tranne i broccoli, che suona come un triste compleanno), ma puoi usarli tutto l’anno!

Il nostro corridore compito di scelta è Grunt.js

Il nostro Task Runner di scelta

Abbiamo scelto di utilizzare Grunt.js. E ‘ il corridore compito più ampiamente supportato e popolare sul mercato. Funziona leggendo un Gruntfile che contiene la configurazione dell’attività in un oggetto Javascript. Quindi esegui un comando nel tuo terminale per specificare quale attività desideri eseguire. Facile peasy.

Il tuo Gruntfile può essere semplice o robusto come vorresti, a seconda delle attività che stai eseguendo.

I Gruntfile tipici eseguono le seguenti operazioni:

CSS

  • Compilare Sass in CSS
  • Esegui Autoprefixer sul nuovo CSS per la cattura di qualsiasi fornitore prefissi abbiamo perso
  • Minimizzare l’utilizzo dei CSS
  • Aggiornare le nostre CSS banner con le nuove informazioni di timestamp

Javascript

  • Controllare il nostro Javascript per errori
  • Concatenare altri script inclusi in un unico file
  • Ricontrollare gli errori
  • Minify Script

Immagini

  • Ottimizzare qualsiasi formato JPG, GIF o PNG per rendere il file di dimensioni più piccole

Altre Utilità

  • Guarda i file per le modifiche e riesegui le attività in base alle esigenze
  • Esegui BrowserSync per test su più browser e dispositivi contemporaneamente

Puoi immaginare quanto sarebbe doloroso eseguire queste attività manualmente. Tutto quello che dobbiamo fare è eseguire un semplice comando:

$ grunt

Proprio come per magia, questo comando esegue tutti i nostri compiti e ci salva dal ripeterci.

Per ulteriori informazioni su Grunt.js, controlla la loro documentazione e inizia a guardare Gruntfiles.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.