search

BrowserSync / browser-sync

Keep multiple browsers & devices in sync when building websites. https://browsersync.io
https://discord.gg/2d2xUThp
Apache License 2.0
12.18k stars 755 forks source link

Dramatic Speed Difference between Local and External URLS #1154

Open dmr07 opened 8 years ago

dmr07 commented 8 years ago

Issue details

Visiting http://localhost:3000, each file request takes at least a second, and it takes about 2-5 minutes to fully load one html page (100+ css, html partials, and scripts). While using the External URL takes about 2-3 seconds to load, which is tolerable.

Added I ran browsersync after concatenating the source to about 10-20 files. It's much faster than before, but file retrieval req are still taking over a second each.

I read on StackOverflow that this is a namespace issue with localhost, even after changing hosts, it was still extremely slow.

Steps to reproduce/test case

Running my app in pm2, 4 instances cluster mode. 

var  browsersync = require("browser-sync").create(),
       reload = browsersync.reload,

    gulp.task('sync', ['browsersync'], function() {
      gulp.watch(['public/**/*.js'], reload);
      gulp.watch(['public/**/*.css'], reload);
      gulp.watch(['public/**/*.html'], reload);
    })

    gulp.task('browsersync', function() {
      browsersync.init({
          proxy: '127.0.0.1:3003',
          files: ["public/**/*.css", "public/**/*.js", "public/**/*.html"]
      });
    });

Please specify which version of Browsersync, node and npm you're running

juliogc commented 8 years ago

Same issue here, but in other scenario. I'm using the API to proxy an app started by nodemon.

I noticed that when some file is saved, the Firefox warns from a disconnection and starts a long restart. Chrome or Safari just "freezes" on the loading status as is possible to see looking to this screen shots.

Firefox screen shot 2016-10-26 at 2 58 33 am

Chrome screen shot 2016-10-26 at 3 15 42 am

Safari screen shot 2016-10-26 at 3 15 30 am

Steps to reproduce/test case

'use strict';

const nodemon = require('nodemon');
const browserSync = require('browser-sync').create();

nodemon({
      script: './bin/www'
    , ext: 'js json html css'
});

browserSync.init({
    proxy: "localhost:3000",
    port: 5000,
    notify: true,
    online: true
});

nodemon
    .on('start', () => console.log('App has started'))
    .on('quit', () => console.log('App has quit'))
    .on('restart', (files) => {
        browserSync.reload({ stream : false });
    });

Please specify which version of Browsersync, node and npm you're running

Affected platforms

Browsersync use-case