Adobeフォントとgoogleフォントでどれぐらい違うのかテストしてみた
少し興味があったので簡単にではありますが、2つのwebフォントを使って速さの比較をしてみました。
コードを貼るのは不味そうなので貼ってありませんが、デモ用にかんたんなページは用意してあります。
比較するためのルール
フォントはどちらからでも使える『RocknRoll One』というものを利用して比較をします
同じサーバー内の同じ階層のディレクトリにほとんど同じコードでアップロードしました
フォントを読み込む部分のコードは同じにはできないので違いはそこだけ
adobeフォントの結果
adobeフォントを使って作ったページ
PageSpeed Insightsのスコア
Adobeフォントの方はPageSpeed Insightsで100点という最高のスコアを出しました。
少し気になる点は更新をかけた時に一旦デフォルトのフォントで表示されているのがはっきり見えるところぐらいです
googleフォントの結果
googleフォントを使って作ったページ
PageSpeed Insightsのスコア
googleフォントの方はPageSpeedInsightsで88点というスコアを出しました。
こちらの方は更新をかけた時にデフォルトのフォントで表示されてるのは全く見えないです
すごい簡素なHTMLですが、PageSpeedInsightsで12点の差が出たのは驚きです。
が、Adobeのフォントは一瞬デフォルトのフォントがちらつくのは気持ちが悪くもあります。
個人的にはgoogleフォントのほうがいいかなとは思いますが、Adobeのフォントを使って単価を上げる人もいると思うのでそうしたい人にはいい結果になったのではないでしょうか
もう少し別の要因も追加して、webフォントを使わなかったケースを追加したりして、さらなる調査が必要ですね
