Why does the gulp collector take so long to start?

Question

JavaScript

There is this assembly:

var gulp 		= require('gulp'),
    browserSync = require('browser-sync'),
    sass 		= require('gulp-sass'),
    cssnano     = require('gulp-cssnano'),
    del         = require('del'),
    autoprefixer= require('gulp-autoprefixer'),
    htmlmin     = require('gulp-htmlmin'),
    ignore      = require('gulp-ignore'),
    imagemin 	= require('gulp-imagemin'),
    spritesmith = require('gulp.spritesmith'),
    jade        = require('gulp-jade');

gulp.task('sass', function(){
  return gulp.src('app/scss/main.scss')
    .pipe(sass())
    .pipe(autoprefixer())
    .pipe(gulp.dest('app/css'))
    .pipe(browserSync.reload({stream: true}))
});

gulp.task('jadeh', function() {
  gulp.src('./app/jade/index.jade')
    .pipe(jade())
    .pipe(gulp.dest('./app'))
    .pipe(browserSync.reload({stream: true}))
});

gulp.task('browser-sync', function(){
  browserSync({
    server: {
      baseDir : 'app'
    },
    notify: false
  })
});

gulp.task('sprite', function () {
  var spriteData = gulp.src('app/img/icons/*.png').pipe(spritesmith({
    imgName: 'sprite.png',
    cssName: 'sprite.scss'
  }));
  return spriteData.pipe(gulp.dest('app/sprites/'));
});

gulp.task('watch', ['browser-sync'], function(){
  gulp.watch('app/*.html', browserSync.reload);
    gulp.watch('app/css/main.сss', browserSync.reload);
  gulp.watch('app/js/**/*.js', browserSync.reload);
});

gulp.task('clean', function() {
    return del.sync('dist'); // Delete folder dist before build
});

gulp.task('build', ["clean", "sass"], function() {

    var buildCss = gulp.src('app/css/**/*') // Dest css in production
    .pipe(cssnano())
    .pipe(gulp.dest('dist/css'))

    var buildImage = gulp.src('app/img/**/*') // Dest img in production
    .pipe(imagemin())
    .pipe(gulp.dest('dist/img'))

    var buildJs = gulp.src('app/js/**/*') // Dest js in production
    .pipe(gulp.dest('dist/js'))

    var buildHtml = gulp.src('app/*.html') // Dest HTML in production
    .pipe(htmlmin({collapseWhitespace: true}))
    .pipe(gulp.dest('dist'));

});

As a result, if I run the command for the first time gulp watch(let's say for a day), then it starts for almost a couple of minutes. But then, starting from the second time, it starts in a couple of seconds. Can you explain why?

Answer 1

The gulp plugins in node_modules contain a huge number of subfolders containing many small files. Until it reads all this economy from the disk, a lot of time will pass. And then yes, from the disk cache.
A random project using gulp to build: