変更入ったファイルのみトランスパイル等したかったので gulp-cached と gulp-remember を使った

Gulp初心者です。

gulpfile.js

gulp.task('transform', function () {
  return gulp.src('./scripts/**/*.js')   
    .pipe(babel())
    .pipe(react())
    .pipe(gulp.dest('./dist'));
});

こんな感じで、watchifyでファイル監視して、gulp-babelとgulp-reactを使ってトランスパイルとトランスフォームの処理を行っているのですが（babelifyのほうがいいのかな）、このタスクで現在2sec近くかかっていてなんかいい方法あるだろうと思って調べたら、

ありました。gulp-cachedとgulp-remember使って、差分のみ処理行うようにできるよと。

gulpfile.js

gulp.task('transform', function () {
  return gulp.src('./scripts/**/*.js')
    .pipe(cached('transform-cache'))    
    .pipe(babel())
    .pipe(react())
    .pipe(remember('transform-cache')) 
    .pipe(gulp.dest('./dist'));
});

これまで毎回処理が走る度にこれくらい時間のかかっていたものが

[11:14:53] Finished 'transform' after 1.95 s
[11:15:15] Finished 'transform' after 1.42 s
[11:15:21] Finished 'transform' after 1.38 s
[11:15:27] Finished 'transform' after 1.57 s

以下のように確かに早くなっています（watch開始時にも処理を走らせているので初回は時間かかっている）

[11:13:05] Finished 'transform' after 1.93 s
[11:13:20] Finished 'transform' after 78 ms
[11:13:28] Finished 'transform' after 80 ms
[11:13:33] Finished 'transform' after 68 ms