grunt faster loading tasks

Question

Is there anybody who can tell me how to get grunt tasks load faster. I really want to reduce the loading time, because most tasks require 1 second to load.

Especially for 'watch' task. when I am watching for changes, I really want to compile sass much faster.

Any ideas?

Thanx

Answer 1

You are really looking for this: jit-grunt.

Instead of loading all tasks every time, jit-grunt will only load those that are necessary.

Answer 2

Had the same problem as the OP: grunt watch was very slow for compiling .less files and liveReload so here's what I did:

1. install time-grunt to show execution times for each task:

   $ npm install --save-dev time-grunt
   

   and then place this line right after module-exports:

   module.exports = function(grunt) {
   require('time-grunt')(grunt);
   

   After running grunt you will notice which tasks took longer than others. In my case it was loading all dependencies on every file change, so I found this solution:

2. install jit-grunt to load dependencies on demand instead of loading all of them each time grunt performs a task.

   $ npm install jit-grunt --save-dev
   

   and replace the initial loader in the gruntfile

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

   with

   require('jit-grunt')(grunt);
   

This saved my liveReload time for .css updates from ~1600ms to ~250ms.

PS: @curist suggested jit-grunt as well but I thought that more details might help anyone.

Answer 3

If your grunt is in a Vagrant virtualbox, you can synchronize via nfs, which is a bit faster than the default sharing. (but still way slower than a native filesystem)

In your Vagrantfile:

config.vm.synced_folder ".", "/vagrant", type: "nfs"

On my machine, time for grunt to load tasks (with ssd):

native:                  ~1s
nfs:                     ~4s
default Vagrant sharing: ~16s

Answer 4

It sounds like your computer is the problem here, you will not have many options but to upgrade.

The only thing I can think of is concurrent tasks, if you can run the tasks concurrent you might shave some time off.

You could use grunt-concurrent as said on the repo:

Running slow tasks like Coffee and Sass concurrently can potentially improve your build time significantly. This task is also useful if you need to run multiple blocking tasks like nodemon and watch at once, as seen in the example config.

You can also load the tasks only when needed with this trick.

Answer 5

Same problem here, after changed and execute task all modules was reload.

But i found a very good solution on github (https://github.com/steida/grunt-este-watch)

What's wrong with official grunt-contrib-watch?

It's slow and buggy, because it uses combination fs.fileWatch and fs.watch, for historical reason. From Node 0.9.2+, fs.watch is ok.

What to do?

1. install grunt-este-watch

   npm install grunt-este-watch --save-dev
   

2. change contrib watch

   grunt.loadNpmTasks('grunt-contrib-watch');
   

   to este watch

   grunt.loadNpmTasks('grunt-este-watch');
   

3. change task

   watch: {
     javascript: {
         files: 'src/js/**/*',
         tasks: ['uglify']
     }
   }
   

   to

   esteWatch: {
      options: {
         dirs: ['../src/**/*']
      },
      'js': function(filepath) { return 'uglify' }
   }