Googleフォントのプリコネクト

注: Next.jsはバージョン12.0.1以降、自動的に<link rel="preconnect" />を追加します。

Googleフォントでpreconnectが使用されていることを確認してください。

このエラーが発生した理由

Google Fontsドメインへのリクエストでpreconnectリソースヒントが使用されませんでした。オリジンへの早期接続を開始するためにpreconnectを追加することをお勧めします。

考えられる修正方法

Google Fontドメインの<link>タグにrel="preconnect"を追加します

<link rel="preconnect" href="https://fonts.gstatic.com" />

注: preconnectをサポートしないブラウザのフォールバックとして、dns-prefetch付きの別のリンクを使用できますが、これは必須ではありません。

役立つリンク

• 必要なオリジンへのプリコネクト
• プリコネクトとdns-prefetch
• Next.jsフォントの最適化