grunt vs gulp vs…

¿qué automatizador de tareas funciona mejor?

Velázquez

archivado en: JavaScript / 11 enero, 2016

En el momento de escribir estas líneas, en enero de 2016, los dos automatizadores de tareas más célebres son grunt y gulp. Es tema de discusión cuál de los dos es mejor, pero gulp parece ser la herramienta saliente (18.555 stats en git-hub frente a las 10.376 de grunt), aunque esto no quiere decir nada dado que en el mundo front-end lo último de lo próximo suele mirarse siempre con mejores ojos.

En general, la mayor diferencia bajo el capó entre uno y otro es que grunt trabaja con plugins grandes que van contra archivos temporales, mientras que gulp tira de plugins pequeños y específicos que se procesan en memoria (en streams de node). Esto hace que gulp sea un poco más rápido, aunque no tengo yo claro si la diferencia es realmente significativa, sobre todo si tenemos en cuenta que muchas tareas pesadas -como la concatenación-uglificación o la babelificación de ecmaScript 6 al 5- no es necesario ejecutarlas en tiempo real, sino antes de pusear al repo o similares.

En cambio, lo que sí es distinto de veras es la manera en que se trabaja con cada uno. En grunt, todo el peso recae en la configuración, mientras que en gulp prima la programación. Esto se entiende bien con código.

Así por ejemplo es cómo se prepara el gruntfile para que concatene y minifique los archivos js de un sito o aplicación web:

'use strict';

module.exports = function(grunt) {

require('load-grunt-tasks')(grunt);

grunt.initConfig({

uglify: {

js: {

options: {

mangle: false,

sourceMap: true,

drop_console: true,

sourceMapName: 'dist/js/app.map'

},

files: [{

src: 'src/js/**/*.js',

dest: 'dist/js/app.min.js'

}]

}

}

});

grunt.registerTask('default', ['uglify']);

};

Y así sería en gulp (obsérvese que hay que cargar más micro-plugins).

const gulp = require('gulp');

const uglify = require('gulp-uglify');

const concat = require('gulp-concat');

const sourcemaps = require('gulp-sourcemaps');

const plumber = require('gulp-plumber');

var configUglify = {

mangle: false,

compress: {

sequences: true,

properties: true,

dead_code: true,

drop_debugger: true,

drop_console: true,

conditionals: true,

comparisons: true,

booleans: true,

if_return: true,

join_vars: true,

warnings: true

},

outSourceMap: true

};

var configMap = {

loadMaps: false,

debug: true

};

var configConcat = {

newLine:'\n;'

};

gulp.task('default', () => {

return gulp

.src('src/js/**/*.js')

.pipe(plumber())

.pipe(sourcemaps.init(configMap))

.pipe(concat('app.js', configConcat))

.pipe(uglify(configUglify))

.pipe(sourcemaps.write('.', {

includeContent: true,

sourceRoot: '/',

}))

.pipe(plumber.stop())

.pipe(gulp.dest('dist/js/'));

});

Otra diferencia grande es el número de plugins disponibles en grunt, mucho mayor que el de gulp, 4.403 frente a 2.083, aunque es de suponer que poco a poco se vayan equiparando y, en cualquier caso, los más importantes están disponibles para los dos automatizadores.

Hay alguna que otra diferencia más, pero con lo expuesto baste para preguntarnos cuál es el más conveniente para nuestro proyecto.

Una respuesta habitual a esta pregunta es que no hay uno mejor que otro y que lo más recomendable es usar con lo que uno se siente más cómodo. Groso modo estoy de acuerdo con esta propuesta, aunque no tengo claro si para proyectos muy grandes es mejor grunt... pero esto lo podré saber con mayor certeza cuando haga algún proyecto tremebundo con gulp, que aún no he tenido ocasión.

Por último, creo que es interesante incluir en este debate otras opciones, como el npm. Es lo que sostiene, por ejemplo, Keith Cirkel en un post que lleva por título Why he should stop using Grunt & Gulp. Entre otras ideas, Cirkel argumenta que es de locos tener que usar para unas cosas grunt y otras gulp, que está harto de que casquen cosas en los dos automatizadores y que no ve nada claro que compense este frenesí javascripteano por ir cambiando cada dos por tres de herramientas:

«I've also spoken to developers who have migrated from Grunt to the-next-best-thing (e.g. Gulp), because of the touted amazing new benefits, proudly proclaiming that after 2 weeks work their 30 second build time went down to 3 seconds».

Así, propone, lo mejor es tirar de una herramienta que funciona muy bien y que no le da problema alguno:

«There is a tool which can run build scripts, carry configuration values, is streaming, has an incredibly simple API, and comes free with every Node.js installation: npm».

La idea no es descabellada, pero yo tengo que darle más vueltas antes de dar mi opinión. Y con esto chapo por hoy.

(ver presentación asociada a este texto)

|| Tags: , , ,

Este artículo aún no ha sido valorado.

¿Te ha parecido útil o interesante esta entrada?
dormido, valoración 1 nadapensativo, valoración 2 un poco sonrisa, valoración 3 a medias guiño, valoración 4 bastante aplauso, valoración 5 mucho

Tú opinión es muy importante, gracias por compartirla!

Aportar un comentario


*