Question

我开发了一个可以脱机使用的应用程序。它使用它自己定制的Web服务器进行部署，并使用默认浏览器连接到它。

由于它处于脱机状态，我还在文件系统中存储了加载@font-face的字体。显然，由于许多样式和字符集，它们在浏览器加载之前需要一些时间。

我正在使用Chrome（最新版）对其进行测试，并且 flash of unsstyled text （FOUT）非常烦人。

在本地环境中工作时如何减少FOUT？

Answer 1

在加载css文件之前隐藏整个html或所有文本怎么样？

在您的顶部，您将包括以下内联样式：

<head>
    <style>html{visibility: hidden}</style>
    <link rel="stylesheet" href="/static/default/style.css"/>
</head>

在style.css的底部，或@ font-face声明之后，您将使html再次可见：

html {visibility: visible}