Очень медленный запуск сервера BrowserSync с Gulp

Question

Я использую BrowserSync в режиме сервера (используя встроенный статический сервер) с GulpJS в локальном проекте, и все, кажется, работает правильно, за исключением того, что сервер BrowserSync запускается очень медленно. Кажется, что сам BrowserSync инициализируется сразу, когда я запускаю Gulp, но для запуска сервера и для возврата URL-адресов доступа требуется около 4-5 минут (а иногда и больше). В течение этого периода все продолжает работать, и BrowserSync отвечает на вызовы reload() и тому подобное, но доступ через обычные URL-адреса недоступен (в данном случае localhost:3000 и localhost:3001). Как только URL-адреса доступа возвращены, сервер, по-видимому, запустился, и обновления страницы BrowserSync работают нормально и на самом деле очень быстро.

Я пробовал несколько разных конфигураций моего gulpfile.js, пробовал разные способы инициализации BrowserSync, разные подходы к вызову методов stream() и reload() (включая пробу основного рецепта Gulp/SASS BrowserSync) и разные номера портов, но все конфигурации имели одну и ту же проблему. Я даже пытался отключить брандмауэр и программное обеспечение AV (Avast), но ничего не вышло.

Я использую Windows 8.1, если это актуально. BrowserSync заново устанавливается локально в проект через NPM, и при новой локальной установке в другие каталоги возникает та же проблема. NPM, Ruby, Gulp и все модули выглядят современными. Что бы это ни стоило, весь мой другой опыт работы с Ruby, Gulp и Node.js был очень плавным и без проблем.

Я не могу найти другие посты, упоминающие эту проблему, и начинаю думать, что это нормальное поведение. Это нормально, и если нет, у кого-нибудь есть идеи, что можно попробовать? Эта задержка - не конец света, поскольку сервер BrowserSync всегда запускается (в конце концов), но это все же излом в моем рабочем процессе, который я предпочел бы исправить, а не просто разобраться.

Наконец, вот мой gulpfile.js: /* Файл: gulpfile.js */

var gulp  = require('gulp'),
    gutil = require('gulp-util');
    jshint = require('gulp-jshint');
    sass   = require('gulp-sass');
    concat = require('gulp-concat');
    uglify = require('gulp-uglify');
    sourcemaps = require('gulp-sourcemaps');
    imagemin = require('gulp-imagemin');
    browserSync = require('browser-sync').create();

gulp.task('default', ['watch'], browserSync.reload);

// JSHint
gulp.task('jshint', function() {
  return gulp.src('src/js/**/*.js')
    .pipe(jshint())
    .pipe(jshint.reporter('jshint-stylish'));
});

// Build JS
gulp.task('build-js', function() {
  return gulp.src('src/js/**/*.js')
    .pipe(sourcemaps.init())
      .pipe(concat('main.js'))
      //only uglify if gulp is ran with '--type production'
      .pipe(gutil.env.type === 'production' ? uglify() : gutil.noop()) 
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('public/www/js/core'));
});

// Build CSS
gulp.task('build-css', function() {
    return gulp.src('src/sass/**/*.{sass,scss}')
        .pipe(sourcemaps.init())
            .pipe(sass()).on('error', handleError)
        .pipe(sourcemaps.write()) // Add the map to modified source.
        .pipe(gulp.dest('public/www/css/core'))
        .pipe(browserSync.stream({match: '**/*.css'}));
});

// ImageMin
gulp.task('imagemin', function () {
    return gulp.src('src/img/*')
        .pipe(imagemin({
            progressive: true,
            svgoPlugins: [{removeViewBox: false}]
        }))
        .pipe(gulp.dest('public/www/img'));
});

// Handle errors
function handleError(err) {
  console.log(err.toString());
  this.emit('end');
}

// Watch function
gulp.task('watch', function() {
    browserSync.init({
      server: "./public/www",
      //port: 3002
    });

    gulp.watch('src/js/**/*.js', ['jshint']);
    gulp.watch('src/sass/**/*.{sass,scss}', ['build-css']);
    gulp.watch('src/js/**/*.js', ['build-js']);
    gulp.watch('src/img/*', ['imagemin']);
    gulp.watch("public/www/css/**/*.css").on('change', browserSync.reload);
})

Answer 1

Аккаунт BrowserSync в Twitter предложил установить для параметра "онлайн" значение true, и... похоже, это сработало!

Я установил его в init BrowserSync следующим образом:

browserSync.init({
  server: "./public/www",
  online: true
});

... и задержка прошла!

Если обратиться к документам BrowserSync ( http://www.browsersync.io/docs/options/), то кажется, что при установке для параметра "онлайн" значения "true" пропуск онлайн-проверки пропускается. Итак, я думаю, что проверка как-то вызвала задержку? Мне это кажется странным, но сейчас это работает лучше.

Answer 2

В моем случае у меня был этот код в gulpfile, который задерживает запуск примерно на 50 секунд.

gulp.watch('./**/*.{js,html}').on('change', browserSync.reload);

и проблема была в строке glob. Он проверяет даже папку node_modules. И я сделал некоторые изменения

gulp.watch(['./scripts/**/*.{js,html}', './index.html'])
  .on('change', browserSync.reload);

Я думаю, что это особенность производительности, что мы должны более точно указать glob.