浏览器同步（BrowserSync）极其缓慢

Question

我很想在开发中使用BrowserSync。但是，页面加载（不仅仅是在更改后重新加载）非常缓慢。

我使用了proxy模式。如果没有使用BrowserSync浏览页面，则速度正常。

可能的原因之一是我安装BrowserSync时出现了以下错误：

> ws@0.4.31 install /usr/local/lib/node_modules/browser-sync/node_modules/socket.io/node_modules/engine.io/node_modules/ws
> (node-gyp rebuild 2> builderror.log) || (exit 0)

CXX(target) Release/obj.target/bufferutil/src/bufferutil.o
SOLINK_MODULE(target) Release/bufferutil.node
SOLINK_MODULE(target) Release/bufferutil.node: Finished
CXX(target) Release/obj.target/validation/src/validation.o
SOLINK_MODULE(target) Release/validation.node
SOLINK_MODULE(target) Release/validation.node: Finished

我从头开始安装了Node（使用brew和软件包安装程序），但无法摆脱错误。

此外，无论是使用Gulp运行还是通过命令行运行BrowserSync都没有任何区别。

有任何想法吗？

- Rico Leuthold

Answer 1

解决方案非常简单，但在我看来有些不合逻辑。我的本地实例是运行在 http://project.local 上的。将它改为 http://project.dev 就解决了问题。我正在使用OS X操作系统。

- Rico Leuthold

---

可以运行。但是...但是...为什么？ - henrijs

如果你也在运行OS X，我猜问题与DNS查询有关（Bonjour也使用.local域名）。 - Rico Leuthold

苹果电脑用户的惊人提示。非常感谢！ - Armel Larcier

在Linux Ubuntu 14上遇到了同样的问题，将我的URL从'local.domain.co.uk'更改为'domain.dev'完美解决了！所以非常感谢你，否则我永远不会解决它。 - JDavies

请注意，Chrome现在中的.dev会强制重定向到https，这并不是我想要的本地设置。这迫使我现在使用.test。 - kapoko

Answer 2

您经历的问题很可能是由于在.local域上进行DNS查询时发出Bonjour IPv6查找引起的。这些IPv6查找会创建一个超时延迟，直到发出原始的IPv4 DNS查找。

@RicoLeuthold的解决方案可行，因为.dev域不会触发macOS上的Bonjour查找。但如果您已经有许多运行在.local域上并配置为使用这些.local域的项目，更改所有vHosts可能会很麻烦。

另一种选择是在主机文件（Linux上为/etc/hosts，在macOS上通常为/private/etc/hosts）中为每个IPv4 .local条目添加额外的IPv6本地主机条目。

更改此主机内容...

127.0.0.1   phpmyadmin.local
127.0.0.1   project1.local
127.0.0.1   project2.local

...到那个主机的内容...

::1 phpmyadmin.local
127.0.0.1   phpmyadmin.local
::1 project1.local
127.0.0.1   project1.local
::1 project2.local
127.0.0.1   project2.local

提示：使用正则表达式编辑器

如果您正在使用像Atom或Sublime Text这样支持正则表达式搜索/替换的编辑器，则可以使用以下模式更新您的主机文件：

Search:
(127.0.0.1)(.*)$
Replace:
::1$2\n$1$2

这个模式还会在hosts文件顶部的IPv4本地主机条目中添加IPv6条目。 在执行搜索/替换操作之后，您应该检查文件顶部是否存在重复条目...

::1  localhost

...并删除其中一个重复项。

- Jpsy

---

哇！这让我大开眼界。现在速度好快啊！之前我一直想知道为什么回到家里上网会比在公司慢，但现在你刚刚帮我解决了这个问题。谢谢你！ - Aaron Olin

嘭。这是一个非常丰厚的小费。 - rob_was_taken

非常感谢@Jpsy - 我每次刷新都会遇到长达20秒的延迟，现在几乎是瞬间完成了！这将为我节省大量时间 :-) 这应该是被采纳的答案！ - simonl

闪电般的快速。使用BrowserSync + HTTPS时运行得非常顺畅。 - Jimmy Adaro

非常感谢您的解释！了解为什么会花费很长时间是很有好处的。尽管被接受的答案可能已经解决了问题，但您已经揭示了它的神秘面纱。我已经学到了一个关于网络/开发服务器慢速可能原因的宝贵经验！ - SidOfc

Answer 3

在我的情况下，我使用的是Windows。 在分析Firebug的网络选项卡后，我注意到有几张图片丢失了。 一旦我修复了这些图片，它就变得更快了！

- Maximus

Answer 4

我尝试了其他方法，对我来说效果非常好。

我使用以下命令在我的Mac上禁用了IPv6：

networksetup -setv6off Wi-Fi

您可以像这样重新打开它：

networksetup -setv6automatic Wi-Fi

我不想转向 .dev，因为我的所有网站都是按照这种方式设置的：

Live site: https://www.myawesomesite.com
Local site: https://dev.myawesomesite.com

- Patrick Hladun