Light House の監査では、キー リクエスト、特に React アプリで使用している 2 つの Google フォントをプリロードするよう提案されています。Light House のメンバーは、次の使用を提案しました。
<link rel="preload" as="style" href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto:700" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
ウォーターフォールに表示され、次のコンソール警告が表示されるため、リクエストを行っていることがわかります。
「リソースhttps://fonts.googleapis.com/css?family=Open+Sans|Roboto:700は、リンクのプリロードを使用してプリロードされましたが、ウィンドウのロード イベントから数秒以内に使用されませんでした。値であり、意図的にプリロードされています。」
残念ながら、この 2 つのフォントはアプリに表示されなくなりました。@font-face などを使用して CSS でこれらを定義する必要がありますか?