Webフォントを利用するサイトは遅い？

Webフォントは画像などと同じで、データを取得し表示させるため、多少なりともサイト速度へ影響を及ぼします。

サイト速度を最優先させる場合

Webサイトの性質にもよりますが、サイト速度を最優先させたい場合は、搭載フォントを利用しブラウザ依存にさせることが最善です。
ただ、ブランディングの観念上、デザインを重視させたい場合はWebフォントを使用した方が良いWebサイトもあるかと思います。

Webフォントは実装の仕方で早くできる

ダイナミックサブセッティング方式

軽量化という点では、必要な文字だけ取得するダイナミックサブセッティング方式が一般的に使用されます。
コチラの方法を利用すると例えば１つのwebページで使っている文字数が、3,000文字程度だったとしても、重複文字を取り除くと通常数百文字になります。

ダイナミックサブセットは、ニュースフィードやコメントセクションなど、DOM（Document Object Model）へのすべての変更を検知し、フォントサブセットに追加する必要のある新しい文字をサーバーにリクエストします。このようにして、フォントを読み込むたびにフォント全体をダウンロードするのではなく、追加のグリフのみをリクエストし、ブラウザーですぐに更新できるようになりました。

参考：https://helpx.adobe.com/jp/fonts/using/dynamic-subsetting.html

サブセット化

WebAPIであらかじめ、サブセットフォントを取得し、CSSの中にBase64で組み込んでWebフォントを表示させる方法もあります。 サブセット化は以下の記事が参考になりました↓ https://envydesign.jp/blog/2023/08/webfont-subset/

必要な文字だけ取得する問題点

実際にある企業様のページ数の多いWebサイトを実装した際、Webフォントを上記の方法で実装したのですが、例外もありました。

漢方なども取り扱っている製薬会社様で、サイト上に中国語や日本語でも難しいタイプの日本語が使われている場合、「JIS第1水準＋常用漢字＋その他（合計3759字）」だけでは網羅できず、その文字だけ表示が変になってしまいました。
サイト上にある文字をあぶりだして対応したらそんなスピードが速くならない、むしろ遅い…という事で、結果的にWeb上のものを読み込んだ方が早かったという例もありました。

また、記事やコンテンツが更新されていくことで、使う文字も絶対的に予測できないため完璧を求めるのは難しいのかと思います。

最適解を探す

そのため「サイトをきれいに見せるためにWebフォントを使いたいが、ブラウザの速度も重要視したい」場合、 Webフォントの軽量化を行ないつつ、ブラウザフォントやウェイトも近しいフォントをCSSで指定しておき、Webフォントにない場合はそちらを表示にさせる（速度を重視する提案としてクライアントへあらかじめ共有しておく）が、イレギュラーのフォントがある際は少し違和感がある表示になってしまうかもしれませんが、今のところ最適なのではないでしょうか。