Gulp.js, an alternative to Grunt.js

I like Grunt.js. Since I started using it I have applied it to all my web projects. It has improved my workflow by providing a uniform way to perform operations such as combination of files, minification, optimization and testing, to name a few. And I already posted about it when I talked about how to make Javascript more testable.

Grunt made it a non-brainer thing to carry out tasks that were more cumbersome to setup before. More often than not I would not dare to clone a repo and give it a try, if I had to set up many dependencies. Now I feel relieved when I see it contains a Gruntfile.js file.

Here comes Gulp

Today I came across Gulp. At first sight it is another Javascript task runner that looks more concise and less verbose. Its chainable commands are convenient for carrying out operations on streams of data:

var gulp = require('gulp'),
    jshint = require('gulp-jshint'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify');

// Lint JS
gulp.task('lint', function() {
  gulp.src('./src/*.js')
    .pipe(jshint())
    .pipe(jshint.reporter('default'));
});

// Concat & Minify JS
gulp.task('minify', function(){
    gulp.src('./src/*.js')
        .pipe(concat('all.js'))
        .pipe(uglify())
        .pipe(gulp.dest('./dist/'));
});

// Default
gulp.task('default', function(){
  gulp.run('lint', 'minify');

  // Watch JS Files
  gulp.watch("./src/*.js", function(event){
    gulp.run('lint', 'minify');
  });
});

Chaining calls is not only clean, but Gulp also avoids the creation of intermediary files. You could convert LESS files to CSS, concatenate them and minify the output, and only then write the ouput to disk. It is the concept of streams that UNIX commands follow.

I recommend you to have a look at this presentation by Eric Schoff about Gulp.

Trying it out

I have tried Gulp to mimic a rather small Gruntfile.js, and using it feels a lot like using Grunt. For now I don’t see a big reason to migrate to Gulp, but I would definitely like to try it in bigger projects whose build process is more complex.

The truth is that Grunt's ecosystem of plug-ins is very large, even though it is relatively young. You just need to search for what you need and you will very likely find a mature plug-in that does exactly what you need.

Creating a plug-in for Gulp from a Grunt's one is pretty straightforward, so we can expect an explosion of available plug-ins in a near future. I'm only concerned about the duplication of code and the maintainability of the plug-ins once there exist different versions depending on the task runner. Actually it would be great if they could be reused somehow or be compatible with both Grunt and Gulp if they both become widely used.

Conclusion

I will keep watching how the community around Gulp develops and what the general feeling is. For now it looks very promising, and I'm looking forward to see how both Gulp and Grunt evolve.