There’s been a lot of buzz around Gulp lately, and one of the most common arguments for switching from Grunt to Gulp is speed. Gulp is tremendously fast! However, what I have experienced is that Grunt is often unnecessarily slow due to a poor configuration. If you are running Grunt today, it could be a good idea to speed up your tasks instead of paying the price of switching to another tool.

Grunt-time is a great node package to analyze your setup, it visualises how the time is spent when running Grunt tasks.

It turns out that in many cases, most of the time is spent on loading Grunt tasks instead of running them. A common setup for Grunt looks something like this:

module.exports = function(grunt) {
  grunt.initConfig({
    jshint: ...
    watch: ...
    jasmine: ...
    sass: ...
    requirejs: ...
  });

  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-jasmine');
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-contrib-requirejs');

  grunt.registerTask('jslint', 'jshint');
};

Let’s say that want to run the jshint task, what happens is that Grunt will first load all the tasks specified by grunt.loadNpmTasks(), and then run the actual task. In this case we are loading several modules that will never be used. This can very well take quite some time.

Compare the configuration above to this other example, where we only load the tasks that are about to be used.

module.exports = function(grunt) {
  grunt.initConfig({
    jshint: ...
    watch: ...
    jasmine: ...
    sass: ...
    requirejs: ...
  });

  grunt.registerTask('jslint', [], function() {
    grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.task.run('jshint');
  });
};

Faster execution time → Shorter feedback loop → Epic win.