Fontsに正式に追加された日本語フォントが表示の高速化が期待できるよさげな仕様になっています。Fontsの日本語フォント早期アクセスを利用しているサイトは乗り換えを検討しましょう!Webデータ肥大化の伏兵WebフォントたいていのWebページで最も多くの容量を占めているのは画像ですが、最近は画像より日本語Webフォントの方が重たいというサイトも増えてきました。日本語フォントはご存じの通り、文字の種類がとても多いので相当なデータ量になります。Webページの表示高速化にはWebフォントへの考慮も重要です。JPを無造作にフルセットで配信すると4.3MBにもなるそうです。それだけだと太字フォントが含まれません。太字にも対応させるためにはさらに4.4MB(合計8.7MB!)のファイルをユーザーにダウンロードさせる必要があります。一般的にダウンロードが終わるまでは代替フォントが表示されますが、Googlegが推奨する1.6MB(ページ全体)に対してあまりに大富豪すぎるデータ量です。最低限、使用頻度の高い文字だけ抽出したフォントファイルを再構成する必要があります。Fontsでの正式対応が始まったという記事があったので調べてみました。Fontsでは大きな日本語フォントを分割ダウンロードさせているということです。JP用のCSSを直接見てみましょう。https://fonts.googleapis.com/css?family=Noto+Sans+JP確かに細かく分割されている!最初の@font-feceには128文字分のフォントが含まれており、全体で120個の@font-face(Webフォントファイル)に分割されています。することで並列ダウンロードが可能になります。各WebフォントファイルはHTTP/2で配信されています。HTTP/2は複数のファイルをストリーミング的にブラウザに送ることができます。FontsはWebフォントのストリーミング配信を実現したと言ってもよさそうです。Fontsでは以前から日本語フォントを配信していましたが、早期アクセスという扱い(ベータみたいな感じ?)でした。Japaneseは厳密には別ものらしいですが参考まで)。100〜900としてそれぞれ1ファイルを参照しています。分割ストリーミングはされていません。4.3MBからかなりサブセット化されているようですが、やはりなかなかの容量です。Fontsの日本語フォント正式版に多くの改善点や優位性があるとわかりました。ページに合わせた最適化による高速化を図るためには、FONTPLUSのサービスを利用する方法もあります。プログラマーの宮永です。趣味は投資と打撃系格闘技とドローンとブロックチェーンです。InsightsとLighthouse。Insightsの真実。点数の公式と高得点をとれない理由。5項目の最適化をすることがスコアアップの近道。パフォーマンス偏差値表(通販サイト編)を作ってみた通販サイトスマホトップには平均4.15MBの画像。画質を落とさず-41%削減可能。InsightsとLighthouse。Insightsの真実。点数の公式と高得点をとれない理由。5項目の最適化をすることがスコアアップの近道。Insignts/表示高速化5スマホ表示高速化73画像最適化132WebP23WebP利用事例6Lighthouse19プロダクトLightFile104Ranklet18MTプラグイン4事例紹介5調査データランキングツール14技術系小ネタ1会社2広報27イベント14セミナーその他5月別アーカイブ2020年1月12019年11月22019年10月42019年9月12019年8月22019年7月22019年6月12019年5月22019年4月62019年3月102019年2月152019年1月52018年12月72018年11月72018年10月132018年9月132018年8月212018年7月162018年6月192018年5月152018年4月142018年3月102018年2月142018年1月92017年12月92017年11月142017年10月32017年8月52017年7月1運営会社についてアイデアマンズは、インターネット技術でオドロキを!提供することを目指しています。