Как в browsersync перезагрузить только изменённую часть кода, а не рефрешить всю страницу?

Question

[Максим]

Для лайв кодинга использую browsersync (может стоит использовать другое решение?)
Очень долго приходится ждать на больших проектах, пока отрефрешится вся страница. Можно как-то сделать, чтобы перезагружалась только изменённая часть кода? Как никак, всё таки используется node.js и webkit - думаю эта связка сейчас может всё, но не могу найти как решить мою проблему.

Answer 1

[Максим Кудрявцев]

Если изменяйте html, особенно если он внутри php-файлов - тогда никак, только обновление всей страницы. Если изменен какой-нибудь css/js и нужно обновить изменения, тогда добавьте browserSync.stream(). Мой пример сборки bootstrap-sass в gulp

gulp.task('bootstrap-sass', function() {
	return sass(src.bootstrap.source, {
			style: 'compressed'
		})
	    .on('error', sass.logError)
	    .pipe(rename(src.bootstrap.dest.name))
	    .pipe(notify('File ' + src.bootstrap.dest.folder + '/' + src.bootstrap.dest.name + ' was compiled'))
	    .pipe(gulp.dest(src.bootstrap.dest.folder))
	    .pipe(browserSync.stream())
});

Comments

[Максим]

у меня почему-то именно рефрешится страница вместо прямого инжекта изменений

[Максим]

то есть я использовал browsersync.stream(), а результат - рефреш

Answer 2

[gassmonkey]

1) html документ в любом случае перезагружается полностью, подгрузить только изменения нельзя.
2) browsersync - лучшее решение на сегодняшний день. Причём превосходит конкурентов на порядок.

Comments

[Максим]

но ведь как-то adobe brackets изменяет html без рефреша, и если я не ошибаюсь это всё происходит на той же связке node.js + webkit

[Максим]

и кстати до абсурда доходит - даже если перезагружать страницу, то вручную на больших проектах это происходит быстрее, чем используя browsersync, так как пока отработают gulp таски, такие как sass (файлов много), то он затупливает.

[gassmonkey]

Максим: Нет, brackets при изменении html тоже перезагружает всю страницу. При изменении css(scss) изменения инклудятся без перезагрузки страницы в обоих случаях.

[Слава]

webpack умеет без перезагрузки все делать, через hot-module-replacement