{"action":"created","issue":{"url":"https://api.github.com/repos/BrowserSync/browser-sync/issues/1456","repository_url":"https://api.github.com/repos/BrowserSync/browser-sync","labels_url":"https://api.github.com/repos/BrowserSync/browser-sync/issues/1456/labels{/name}","comments_url":"https://api.github.com/repos/BrowserSync/browser-sync/issues/1456/comments","events_url":"https://api.github.com/repos/BrowserSync/browser-sync/issues/1456/events","html_url":"https://github.com/BrowserSync/browser-sync/issues/1456","id":271845876,"node_id":"MDU6SXNzdWUyNzE4NDU4NzY=","number":1456,"title":"Very slow page (re-)load/injection on localhost:3000 TTFB of around 5s ","user":{"login":"flurinduerst","id":9006167,"node_id":"MDQ6VXNlcjkwMDYxNjc=","avatar_url":"https://avatars0.githubusercontent.com/u/9006167?v=4","gravatar_id":"","url":"https://api.github.com/users/flurinduerst","html_url":"https://github.com/flurinduerst","followers_url":"https://api.github.com/users/flurinduerst/followers","following_url":"https://api.github.com/users/flurinduerst/following{/other_user}","gists_url":"https://api.github.com/users/flurinduerst/gists{/gist_id}","starred_url":"https://api.github.com/users/flurinduerst/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/flurinduerst/subscriptions","organizations_url":"https://api.github.com/users/flurinduerst/orgs","repos_url":"https://api.github.com/users/flurinduerst/repos","events_url":"https://api.github.com/users/flurinduerst/events{/privacy}","received_events_url":"https://api.github.com/users/flurinduerst/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":4,"created_at":"2017-11-07T14:15:03Z","updated_at":"2018-12-12T06:51:29Z","closed_at":"2017-11-22T09:18:44Z","author_association":"NONE","body":"### Issue details\r\n\r\nWhen accessing `localhost:3000` it takes around 5s to load the page. This means that every time I save changes to (for example) my .scss files, it takes 5s until I see the changes in the browser. Watching the network tab, I can see that there's a [TTFB](https://en.wikipedia.org/wiki/Time_to_first_byte) of around 5s. When accessing my local domain wpdev.local the page takes the assumed 0.3s to load. \r\nThe problem only occurs when accessing localhost:3000\r\n\r\nNetwork Tab Screenshot: https://imgur.com/a/7LPDS\r\n\r\n\r\n* I tested older installations of my local environment running browsersync, they still run without a problem.\r\n* there's not much css/javascript/images to compile in this case. I also ran tests with only 5 lines of css code.\r\n\r\n### Steps to reproduce/test case\r\n\r\nSetting up a local environment using [scotchbox](https://box.scotch.io) (vagrant/virtualbox) with the [WPSeed](https://github.com/flurinduerst/WPSeed) WordPress starter theme.\r\n\r\n### Please specify which version of Browsersync, node and npm you're running\r\n\r\n- Browsersync [ 2.18.13 ]\r\n- Node        [  5.3.0  ]\r\n- Npm         [  8.2.1  ]\r\n\r\n### Affected platforms\r\n\r\n- [ ] linux\r\n- [ ] windows\r\n- [x] OS X\r\n- [ ] freebsd\r\n- [ ] solaris\r\n- [ ] other _(please specify which)_\r\n\r\n### Browsersync use-case\r\n\r\n- [ ] API\r\n- [x] Gulp\r\n- [ ] Grunt\r\n- [ ] CLI\r\n\r\n### gulp-output at CLI\r\n\r\n```\r\nStarting 'clean'...\r\nStarting 'css'...\r\nStarting 'javascript'...\r\nStarting 'images'...\r\nFinished 'clean' after 52 ms\r\nFinished 'css' after 1.29 s\r\nFinished 'javascript' after 1.28 s\r\ngulp-imagemin: Minified 2 images (saved 24.1 kB - 1.3%)\r\nFinished 'images' after 2.38 s\r\nStarting 'default'...\r\nFinished 'default' after 75 μs\r\nUsing gulpfile ~/Code/webdev/public/wp-content/themes/lbb/gulpfile.js\r\nStarting 'browsersync'...\r\nFinished 'browsersync' after 15 ms\r\nStarting 'watch'...\r\nFinished 'watch' after 23 ms\r\n[Browsersync] Proxying: http://webdev.local\r\n[Browsersync] Access URLs:\r\n --------------------------------------\r\n       Local: http://localhost:3000\r\n    External: http://192.168.33.10:3000\r\n --------------------------------------\r\n          UI: http://localhost:3001\r\n UI External: http://192.168.33.10:3001\r\n --------------------------------------\r\nStarting 'css'...\r\n[Browsersync] 1 file changed (style.min.css)\r\nFinished 'css' after 509 ms\r\nStarting 'css'...\r\n[Browsersync] 1 file changed (style.min.css)\r\nFinished 'css' after 224 ms\r\n```\r\n\r\n### gulpfile.js\r\n```\r\n/*\r\n * GULP CONFIG\r\n *\r\n * Desciption:  Clean gulpfile for web development workflow with browsersync, compiling/optimization of sass, javascript and images from assets to dist\r\n * Usage:       gulp (to run the whole process), gulp watch (to watch for changes and compile if anything was modified)\r\n *\r\n * Author:      Flurin Dürst (https://flurinduerst.ch)\r\n *\r\n * Version:     1.3.1\r\n *\r\n*/\r\n\r\n\r\n/* SETTINGS\r\n/===================================================== */\r\nvar browsersync_proxy = \"webdev.local\";\r\n\r\n\r\n/* DEPENDENCIES\r\n/===================================================== */\r\n// general\r\nvar gulp = require('gulp');\r\nvar browserSync = require('browser-sync').create();\r\nvar concat = require('gulp-concat');\r\nvar rename = require(\"gulp-rename\");\r\n// css\r\nvar sass = require('gulp-sass');\r\nvar cleanCSS = require('gulp-clean-css');\r\nvar autoprefixer = require('gulp-autoprefixer');\r\n// js\r\nvar uglify = require('gulp-uglify');\r\n// images\r\nvar imagemin = require('gulp-imagemin');\r\n// error handling with notify & plumber\r\nvar notify = require(\"gulp-notify\");\r\nvar plumber = require('gulp-plumber');\r\n// watch\r\nvar watch = require('gulp-watch');\r\n// delete\r\n// var del = require('del');\r\n\r\n\r\n/* TASKS\r\n/===================================================== */\r\n\r\n/* BROWSERSYNC\r\n/------------------------*/\r\n// initialize Browser Sync\r\ngulp.task('browsersync', function() {\r\n  browserSync.init({\r\n    proxy: browsersync_proxy,\r\n    notify: false,\r\n    open: false,\r\n    online: true,\r\n    host: \"192.168.33.10\",\r\n    snippetOptions: {\r\n      whitelist: ['/wp-admin/admin-ajax.php'],\r\n      blacklist: ['/wp-admin/**']\r\n    }\r\n  });\r\n});\r\n\r\n/* CSS\r\n/------------------------*/\r\n// from:    assets/styles/main.css\r\n// actions: compile, minify, prefix, rename\r\n// to:      dist/style.min.css\r\ngulp.task('css', function() {\r\n  gulp.src('assets/styles/main.scss')\r\n  .pipe(plumber({errorHandler: notify.onError(\"<%= error.message %>\")}))\r\n  .pipe(sass())\r\n  .pipe(autoprefixer('last 2 version', { cascade: false }))\r\n  .pipe(cleanCSS())\r\n  .pipe(rename('dist/style.min.css'))\r\n  .pipe(gulp.dest('./'))\r\n  .pipe(browserSync.stream());\r\n});\r\n\r\n/* JAVASCRIPT\r\n/------------------------*/\r\n// from:    assets/scripts/\r\n// actions: concatinate, minify, rename\r\n// to:      dist/script.min.css\r\ngulp.task('javascript', function() {\r\n  gulp.src('assets/scripts/*.js')\r\n  .pipe(plumber({errorHandler: notify.onError(\"<%= error.message %>\")}))\r\n  .pipe(concat('script.min.js'))\r\n  .pipe(uglify())\r\n  .pipe(rename('dist/script.min.js'))\r\n  .pipe(gulp.dest('./'))\r\n  .pipe(browserSync.stream());\r\n});\r\n\r\n/* IMAGES\r\n/------------------------*/\r\n// from:    assets/images/\r\n// actions: minify\r\n// to:      dist/images\r\ngulp.task('images',  function() {\r\n  gulp.src('assets/images/*.*')\r\n    .pipe(imagemin())\r\n    .pipe(gulp.dest('dist/images'))\r\n    .pipe(browserSync.stream());\r\n});\r\n\r\n/* CLEAN\r\n/------------------------*/\r\n// empty dist folder\r\ngulp.task('clean', require('del').bind(null, ['dist/*']));\r\n\r\n/* WATCH\r\n/------------------------*/\r\n// watch for modifications in\r\n// styles, scripts, images, php files, html files\r\ngulp.task('watch',  ['browsersync'], function() {\r\n  gulp.watch('assets/styles/*.scss', ['css']);\r\n  gulp.watch('assets/scripts/*.js', ['javascript']);\r\n  gulp.watch('assets/images/*.*', ['images']);\r\n  gulp.watch('*.php', browserSync.reload);\r\n  gulp.watch('*.html', browserSync.reload);\r\n});\r\n\r\n/* DEFAULT\r\n/------------------------*/\r\n// default gulp tasks executed with `gulp`\r\ngulp.task('default', ['clean', 'css', 'javascript', 'images']);\r\n\r\n````\r\n\r\n### package.json\r\n```\r\n{\r\n  \"name\": \"fd.gulp\",\r\n  \"description\": \"modules for webdev workflow\",\r\n  \"author\": \"flurinduerst\",\r\n  \"devDependencies\": {\r\n    \"browser-sync\": \"^2.18.13\",\r\n    \"del\": \"^3.0.0\",\r\n    \"gulp\": \"^3.8.6\",\r\n    \"gulp-autoprefixer\": \"^4.0.0\",\r\n    \"gulp-clean-css\": \"^3.9.0\",\r\n    \"gulp-concat\": \"^2.6.0\",\r\n    \"gulp-imagemin\": \"^3.4.0\",\r\n    \"gulp-notify\": \"^3.0.0\",\r\n    \"gulp-plumber\": \"^1.0.1\",\r\n    \"gulp-rename\": \"^1.2.2\",\r\n    \"gulp-sass\": \"^3.1.0\",\r\n    \"gulp-uglify\": \"^3.0.0\",\r\n    \"gulp-watch\": \"^4.3.11\"\r\n  }\r\n}\r\n```\r\n\r\n### hostsfile\r\n```\r\n## SYSTEM DEFAULT\r\n######################################\r\n127.0.0.1       localhost\r\n255.255.255.255 broadcasthost\r\n::1     localhost\r\nfe80::1%lo0     localhost\r\n\r\n# VAGRANT HOSTSUPDATER #\r\n########################\r\n192.168.33.10  webdev.local  # VAGRANT: 607d2454f453f628071f742fbf1a0782 $\r\n```"},"comment":{"url":"https://api.github.com/repos/BrowserSync/browser-sync/issues/comments/446481629","html_url":"https://github.com/BrowserSync/browser-sync/issues/1456#issuecomment-446481629","issue_url":"https://api.github.com/repos/BrowserSync/browser-sync/issues/1456","id":446481629,"node_id":"MDEyOklzc3VlQ29tbWVudDQ0NjQ4MTYyOQ==","user":{"login":"zArubaru","id":16328509,"node_id":"MDQ6VXNlcjE2MzI4NTA5","avatar_url":"https://avatars2.githubusercontent.com/u/16328509?v=4","gravatar_id":"","url":"https://api.github.com/users/zArubaru","html_url":"https://github.com/zArubaru","followers_url":"https://api.github.com/users/zArubaru/followers","following_url":"https://api.github.com/users/zArubaru/following{/other_user}","gists_url":"https://api.github.com/users/zArubaru/gists{/gist_id}","starred_url":"https://api.github.com/users/zArubaru/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/zArubaru/subscriptions","organizations_url":"https://api.github.com/users/zArubaru/orgs","repos_url":"https://api.github.com/users/zArubaru/repos","events_url":"https://api.github.com/users/zArubaru/events{/privacy}","received_events_url":"https://api.github.com/users/zArubaru/received_events","type":"User","site_admin":false},"created_at":"2018-12-12T06:51:29Z","updated_at":"2018-12-12T06:51:29Z","author_association":"NONE","body":"`*.local` seems to be [shared with Bonjour on Macs](https://local.getflywheel.com/community/t/browsersync-gulp-problem-with-local/3616/7)."}}
{"actor":{"display_login":"zArubaru"}}