TL;DR — Google Fonts をシステムフォントに切り替えた結果、Cloudflare の LCP が「100% Good」になり、ページ読み込み時間が 56% 削減（514ms）された。
やったね！
先日 Google Fonts をやめてシステムフォントに切り替えた記事を出してから今日早速確認してみたところ、大幅に改善されてた。いやほんと申し訳ない。海よりも深く反省しています。
LCP：100% Good。 ページ読み込み時間は 514ms で、改善前から 56% 削減。
このブログ、frontend-design スキルにすべて任せて既存テンプレートのデザインを改修してもらったんだけど、こういう重くなる要素に考えが至らなかった。
事象を確認してはじめて自分の失態に気づく、という結果だったので、改めて監視って大事だなと思いました(小並)。
TL;DR — 日本語 Google Fonts（M PLUS Rounded 1c）は初回訪問者の LCP を大幅に悪化させる。システムフォントに切り替えれば外部フォントリクエストがゼロになる。
このブログの Cloudflare Web Analytics を眺めていたら、LCP（Largest Contentful Paint）の評価がなかなかひどいことになっていた。
体感では全然遅くないんだけどなぁ、と思いつつ、Claude さんに原因を調べてもらった。
Claude さん、さすがに早い。表題の通りの結論でした。
どうやら、デザインで使っていた、M+PLUS+Rounded+1c という日本語の丸ゴシックフォントが犯人。
グリフ数が数万文字規模になるので、ファイルサイズが英字フォントとは桁違いに重いとのこと。
詳しく説明してもらいました。
Hugo の設定を見たら、こういう記述があった。
googleFontsLink = "https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;400;700&family=JetBrains+Mono:wght@400;500&display=swap"しかも外部 CDN（fonts.googleapis.com）へのリクエストが発生するので：
- DNS 解決
- TCP 接続
- TLS ハンドシェイク
- フォント CSS の取得
- 実際のフォントファイルの取得
という連鎖が初回訪問のクリティカルパスに入ってくる。LCP がテキスト要素（見出し）だったとすれば、フォントが読み込まれるまでレンダリングがブロックされる。
キャッシュだよ、キャッシュ。
Claude さんに言われて気づいたわ。
自分のブラウザに既にあるんだもん、そりゃ速いはずだよ。
Cloudflare Web Analytics は実際の訪問者のブラウザで計測した RUM（Real User Monitoring）データを集めている。
訪問者のほとんどは初回訪問でキャッシュなし。