Gulp - fix to high CPU usage

TL;DR

gulp.task('default', ['server'], function() {  
    livereload.listen();
    gulp.watch(['path/to/sass/*.scss'], { interval: 500 }, ['style']); #larger intervals on style tasks
    gulp.watch(['path/to/views/*.html'],{ interval: 500 }, ['template']); #larger intervals on template  
    gulp.watch(['path/to/js/*.js'],{ interval: 500 }, ['hinting','test']);
});

I noticed surge in CPU usage while running gulp tasks. As it tourned out, I was not alone having this issue. My project grew bigger and system was poorly perfroming(on a 4 Core, 2GH processors with 8 GB memory).

Breakdown of tasks was:

  • editing code in a text editor
  • running automated tasks
    • unit tests
    • rebuild CSS and HTML templates
    • linting and minify JavaScript.

Updating npm and nodejs version didn't solve the problem. Some tunings from bug Trackers and StackOverflow helped to solve this issue. Here goes the drill:

  1. Reduce the number of files to gulp watch has to watch.
  2. Increase interval the watch has to run, from 100ms(default) to 500ms reduced up to 20% of CPU usage without additional finetunings.
  3. Rethink the workflow
    • Critical tasks such as Start the server, come first.
    • Supporting tasks such as running tests, may come after.
    • Delegate test watch from Karma(Test runner) to gulp.watch().

References

Show Comments