chevron_left
550 points
12 6 5

The 'slow network is detected. fallback font will be used while loading` error occurs because of slow network and due to this reasons chrome would display in fallback font using @font-face CSS rule. In this article, we will discuss the ways to get around this issue.

Photo by S Migaj
TABLE OF CONTENTS
  1. What is "slow network is detected. fallback font will be used while loading"?
  2. How to resolve:
    1. Solution 1:
    2. Solution 2:
    3. Solution 3:
    4. Solution 4:
  3. Conclusion

What is “slow network is detected. fallback font will be used while loading”?

It's just a Chrome issue; it's not a "problem" but a Chrome-specific notification/warning.

For illustration, if you load web fonts like Arial because loading web fonts takes time to download and render, the text is displayed in a fallback font for the time being.  During this wait time, the text would be displayed in Arial which may cause inconsistency if some pixel-based positioning was used. Chrome issues a warning in such a case. Hence we can see the slow network is the cause related to using the @font-face CSS rule.

Displaying it throughout console in multiple rows is kind of annoying and can be considered a bug , ChromeDevTools Team is already aware of this. However, the bug appears to be fixed now, and you should no longer experience it after updating your browser. If this is not the case, there are several workarounds available.

How to resolve “slow network is detected. fallback font will be used while loading”?

Solution 1:

Make chrome flag set to Unknown:

chrome://flags/#force-effective-connection-type

Solution 2: 

Update google chrome to latest version, this was already known to ChromeDevTools Team and this seems to be fixed now.

 

Solution 3: 

The other way to get around this annoying message is to implement following settings to hide the message in chrome tools:

Console settings -> User messages only

 

Solution 4: 

To eliminate the issue from the console, simply add font-display to all css font-face definitions.

@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;
}

 

Conclusion:

Please keep in mind that this issue has been now fixed by ChromeDevTools Team and the best remedy is to update your chrome browser.  In this article, we also discussed other work around to get around this problem.

Hope this helps!! 

If you read this far, tweet to the author to show them you care. Tweet a Thanks
Please let me know your feedbacks about this article.

More Posts

Pseudo-terminal will not be allocated because stdin is not a terminal. zhteja - Aug 17
Which Operator can be used for String Manipulation in Python Ankur Ranpariya - Jul 22
Attributes are not identical across measure variables; they will be dropped zhteja - Sep 5
Which method is used to delete a directory in Python Ferdy - Aug 24
Which data structure is used to perform recursion in Python Ankur Ranpariya - Jul 29
Java_home is not set and no 'java' command could be found in your path. Bushra Rubab - Sep 26
There is a problem with the resource you are looking for, and it cannot be displayed. zhteja - Aug 13
The document could not be saved. A number is out of range- Fixed JimCoder - May 28
Detected Resolved Migration not Applied to Database Hussain Zafar - Jun 14
No network security config specified, using platform default Hussain Zafar - Jun 8
“Thread 1: fatal error: unexpectedly found nil while unwrapping an optional value” - what does it mean? zhteja - Aug 22
Could not identify launch activity: default activity not found error while launching activity. zhteja - Aug 21
MySQL will not start without the configured ports free. Bushra Rubab - Sep 26
The file will have its original line endings in your working directory Ankur Ranpariya 1 - Aug 21
Typeerror: string indices must be integers Ankur Ranpariya - Sep 27
Typeerror: first argument must be callable or none sumitthakur11 - Sep 17
How can a call to an overloaded function be ambiguous? zhteja - Aug 10
Your requirements could not be resolved to an installable set of packages zhteja - Aug 1
List indices must be integers or slices, not tuple zhteja - Jul 30
In order to allow non-dict objects to be serialized set the safe parameter to false Baribor Saturday - Jul 22