为啥这个“检测到慢速网络...”日志出现在 Chrome 中？

Posted 2023-02-22

【中文标题】为啥这个“检测到慢速网络...”日志出现在 Chrome 中？

【英文标题】：Why does this "Slow network detected..." log appear in Chrome?为什么这个“检测到慢速网络...”日志出现在 Chrome 中？

【发布时间】：2017-03-01 18:50:08

【问题描述】：

我注意到这个info log 开始出现在 Google Chrome Dev（版本 55.0.2883.18 dev）中，我无法想象为什么。

检测到慢速网络。加载时将使用后备字体：http://font-path.extension`

它出现在所有使用 font-face 的网站上，甚至出现在本地页面和 Chrome 扩展程序上。

【问题讨论】：

我禁用了这个选项，日志不再出现，但我仍然不知道这意味着什么。 chrome://flags/#enable-webfonts-intervention-v2

@AcauãMontiel 节省时间

@AcauãMontiel lol +1 诚实

ChromeDevTools tweeted 他们正在调查这个问题。

Showing on console: Slow network is detected. Fallback font will be used while loading的可能重复

【参考方案1】：

这意味着网络速度很慢，Chrome 正在用本地回退替换网络字体（加载有 @font-face 规则）。

默认情况下，在下载字体 (“flash of invisible text”) 之前，使用 Web 字体呈现的文本是不可见的。通过此更改，网络速度较慢的用户可以在加载内容时立即开始阅读，而不是在几秒钟内查看空白页面。

相关的 Chrome 问题：https://bugs.chromium.org/p/chromium/issues/detail?id=578029。 （为 3G 连接启用此行为的更改于 9 月登陆；这应该是您收到消息的原因。） 相关源码：https://chromium.googlesource.com/chromium/src/third_party/+/master/WebKit/Source/core/css/RemoteFontFaceSource.cpp#74

【讨论】：

我可以禁用此通知吗？

就像上面提到的 Acauã Montiel 一样，您可以在 chrome://flags/#enable-webfonts-intervention-v2 处禁用此功能

我认为通知对开发有点用处。问题是当 Chrome 为安装在同一控制台日志中的每个扩展程序显示它时，噪音太大了。为扩展显示它有什么意义？

即使字体是从内存/磁盘缓存中加载的，仍然出现此消息的任何原因？这是否意味着从缓存中加载字体也有延迟？

我从本地主机运行并得到同样的错误

【参考方案2】：

编辑：这不适用于最新版本的 63.0+

我能够使用上述 cmets 之一的帮助禁用它，转到

chrome://flags/#enable-webfonts-intervention-v2

诀窍是在其下方也禁用“为 WebFonts 始终加载触发用户代理干预”选项。

【讨论】：

这实际上并没有回答 OP 的问题“为什么该日志首先出现在控制台中”。如果你知道，你可以编辑你的答案。

在 chrome 63 中没有这样的选项，这个错误出现在我面前。

@MortezaZiaeemehr，很不幸。现在整个界面都变了。而且我现在没有遇到这个问题。

我在 66.0.3359.139 中有这条消息。但是没有选项chrome://flags/#enable-webfonts-intervention-v2

对于新的 chrome 版本禁用 chrome://flags/#align-font-display-auto-lcp

【参考方案3】：

我已禁用网络节流，但今天在 75mb/s 的业务连接上开始出现此错误...

为了在我的 Chrome 60.0.3112.90（官方版本）（64 位）版本中修复它，我打开了 DevTools，然后导航到 DevTools 设置，然后勾选“记录 XMLHttpRequests”，取消勾选“仅用户消息”和“隐藏网络”消息'

【参考方案4】：

fontawesome 的字体也有同样的错误。 然后我下载了最新的fontawesome的字体并替换为旧字体。 并且错误消失了。

【讨论】：

您能描述更多吗？你是怎么做到的？

嗯..我认为这可以解决我的问题..让我试试

对我来说很好.. 不起作用.. 我把它改成了 fas fa-plus

【参考方案5】：

禁用此功能的最简单方法是取消选中 chrome 开发工具中的警告

希望这会有所帮助。

【讨论】：

这是个很糟糕的主意。

@JamesGentes 你是对的，这不是一个永久的解决方案。有时，如果您正在调试并且不想看到数百个“检测到慢速网络...”，则最好将其关闭。

同样，你可以说只是关闭浏览器，你也不会看到它。

@NikitaChernykh 这完全不一样。它不是。真的。

这确实会禁用此消息，但也会禁用所有其他可能有用的警告。

【参考方案6】：

我通过设置控制台设置来隐藏它

Console settings -> User messages only

【讨论】：

@AamirRizwan 小心。此设置也会隐藏Error 消息。

这个答案与@David Yew 的答案相同，除了有一些不希望的副作用

【参考方案7】：

我在 MacOs Sierra 上使用 localhost 作为服务器的 chrome build 61.0.3163.100 遇到了同样的问题。当我将网络速度配置更改为 3G 快速/3G 慢速并再次返回在线时，Chrome 开始记录此消息。

修复： 当我尝试选择离线模式并再次选择在线模式时，日志记录问题消失了。 （此修复可能不适用于某些设备或版本）

2018 年 1 月 30 日更新

我将谷歌浏览器更新到版本64.0.3282.119 (Official Build) (64-bit)，现在看来这个错误已经修复了。

【讨论】：

在“网络”选项卡中选中/取消选中“离线模式”切换也对我有用——字体是从本地主机上的开发服务器提供的，所以我不认为它真的是一个“慢速网络”问题 ;-) 就我而言，我什至没有弄乱其他速度配置或任何东西……奇怪。感谢您找到并分享此解决方法！

感谢分享这个解决方法 - 也为我工作！我找不到这方面的错误报告，所以我提交了一份：bugs.chromium.org/p/chromium/issues/detail?id=778477

它不适用于 Ubuntu 16.04 上的 Chrome 61.0.3163.91。

这似乎比更改标志更安全，但它在 MacOS Sierra 上的 62.0.3202.89 上不起作用

工作就像一个魅力。这些警告让我发疯了，因为我看不出它变慢的任何原因:)

【参考方案8】：

您可以单击“控制台设置”，然后选中“仅使用消息”框，之后这些消息将不再显示。

【讨论】：

这个答案与@David Yew 的答案相同，除了有一些不希望的副作用

【参考方案9】：

在 Chrome Dev 上单击鼠标右键。然后选择过滤器。并选择消息来源。

【讨论】：

与禁用 chrome 设置中的特定消息相比，仍然不是一个好的解决方案。例如，我正在使用 s-s-r，并且此警报的来源可能与实际应用程序中的相同，因此它也会禁用我想要的日志。除此之外，可能还有很多来源，您需要过滤其中的许多。

【参考方案10】：

转到 chrome://flags/#enable-webfonts-intervention-v2 并将其设置为禁用

这是由于 Chrome 中用于“网络速度”的最新 API 中的一个错误。希望下个版本能修复

【参考方案11】：

在我的例子中，它是 Google chrome 的 AdBlock Plus 扩展。关掉它，它工作得很好。

【讨论】：

在我的例子中，它是“WOT: Web of Trust”扩展。我不明白为什么这个东西需要加载自己的特殊字体，它应该使用任何默认字体。

因为看到错误而关闭 AdBlock 并继续观看广告？完美解决/讽刺

这种行为也可能是因为 javascript/jQuery 代码写得不好。如果您有一个调用但未声明的函数，它可能会发生。如果您要复制/粘贴代码并删除一些未使用的功能，请格外小心。

【参考方案12】：

我刚刚设法使过滤器正则表达式工作：/^((?!Fallback\sfont).)*$/。

将其添加到控制台上方的过滤器字段中，它将隐藏所有包含Fallback font 的消息。

如果你愿意，你可以让它更具体。

【讨论】：

我想我会采用这个解决方案。我认为根本不建议选择某些消息，例如“仅用户消息”。很容易错过您的网络应用程序引发的错误或警告。

【参考方案13】：

通过帮助更新到最新版本的 Chrome (63.0.3239.84) -> 关于为我修复了它。

（实际上，我确实必须在开发人员工具的“网络”选项卡中切换到离线并返回在线，才能消除最后的错误。）

【参考方案14】：

如果您开发的应用程序使用谷歌字体并希望确保您的用户不会看到这些警告。一个可能的解决方案 (detailed here) 是在本地加载字体。

我将此解决方案用于有时互联网速度较慢（或无法访问互联网）但仍提供页面的应用程序，这假设您的应用程序使用 Google 字体并且这些字体的更新并不重要。还假设使用 ttf 字体适合您的应用程序WC3 TTF Font Browser Support。

这是我在本地服务字体的方式：

转到https://fonts.google.com/ 并搜索您的字体

添加您的字体

下载它们

将它们放在站点根目录中

将它们添加到您的@font 文件中

【参考方案15】：

我一禁用 DuckDuckGo Privacy Essentials 插件，它就消失了。有点烦人，因为我提供的字体来自本地主机，所以不应该与慢速网络连接有关。

【参考方案16】：

不，这并不意味着网络很慢。 不，这不仅仅是错误警告。

在将 index.html 中的链接 https://fonts.googleapis.com/icon?family=Material+Icons 替换为集成版本（npm install ....material-icons...）后，我在 Angular Web 应用程序上遇到了这个问题。这可行，但有时 Web 应用程序会显示该警告。

当显示警告时，图标不会在大约 1 秒内呈现，因此用户会看到呈现错误的图标。

我还没有解决办法。

【参考方案17】：

如果您可以访问此扩展的 css，只需在字体定义中添加 font-display:block; 或将反馈发送给此扩展的开发人员:)

@font-face 
  font-family: ExampleFont;
  src: url(/path/to/fonts/examplefont.woff) format('woff'),
       url(/path/to/fonts/examplefont.eot) format('eot');
  font-weight: 400;
  font-style: normal;
  font-display: block;

【讨论】：

这是解决问题的正确方法，将 font-display 属性设置为任何非“自动”的值。 developer.mozilla.org/en-US/docs/Web/CSS/@font-face/…

你可以通过将* font-display: block;添加到你的css文件来全局修复它。

font-display 只能在 @font-face 声明中使用。所以* font-display: block; 不会按预期工作。

【参考方案18】：

我注意到如果我单独使用字体的“woff”版本，我会收到此延迟警告消息。但如果我添加“ttf”版本，警告就会消失。由于我使用的是本地 Web 应用程序，因此我在字体文件的大小方面进行了权衡。

font-face 
  font-family: Rakaba;
  src: url(../assets/font/web/Rakaba-Bold.woff) format('woff'),
        url(../assets/font/Rakaba-Bold.ttf) format('ttf');