WordPress

WordPressテーマJINが高速化! FontAwesomeの読み込みをOFFした結果…

WordPressテーマJINが高速化! FontAwesomeの読み込みをOFFした結果…

この記事では、WordPressテーマ「JIN」のfontawesomeの読み込みOFFによる高速化の検証結果をご紹介します!

このサイトはひつじ♂さん(@hituji_1234)が提供されている有料WordPressテーマ「JIN」を利用しています。

今回この「JIN」が3/28のアップデートで高速化の対応として、「FontAwesome」の読み込みをOFFできるようになりました!

【関連記事】WordPressテーマ「JIN」のアップデート情報

今までサイトスピードが遅くなりがちということが言われていた「JIN」。
今回のアップデートで追加された「FontAwesomeの読み込みOFF」の効果が知りたい人も多いですよね!

このサイトではあまりFontAwesomeを利用していなかったので、物は試しということで早速やってみました〜

kaeru
kaeru
ついでにこのサイトで現在使用しているプラグインとか、利用しているサーバーなどをご紹介しますね!

WordPressテーマ「JIN」の高速化「FontAwesomeの読み込みOFF」の検証結果

もう早速この結果からお話しちゃおうと思います。
ぶっちゃけみなさんここが気になる訳ですもんね!

サイトスピードのチェックはGoogleのモバイルサイトの速度をテストができるサイトを利用して確認しました!

WordPressテーマJINの高速化の検証結果アップデート前の状態

 

この状態からやったことは下の2点だけ!

  • JINのテーマアップデート
  • FontAwesomeの読み込みOFF
FontAwesome5の読み込みのOFFは、(カスタマイズ > その他設定から)から設定可能です!

結果は…

WordPressテーマJINの高速化の検証結果テーマのアップデートとFontAwesome5のOFF

 

3Gでの読み込み速度が4秒→3秒に変わりました!!!

まあそもそも色々対策した結果、4秒と早くなっていたのですが、より早くなったのは嬉しいですね!

独自アイコンフォント58種の実装

Ver2.0より、JINテーマ専用の「独自アイコンフォント」を導入しました。

FontAwesomeとは少し違ったデザインを取り揃え、テーマの雰囲気に合わせて統一感を出しています。アイコンデータは非常に軽量、書き出しもSVGなので速く美しく描画されます。

JIN2.0にするとテーマの基本構成パーツはすべてオリジナルアイコンに置き換わるようになっています。

引用:「JIN」公式サイト

独自アイコンフォントの実装もされたので、もし使いたいアイコンがあったらこれも利用してみましょう!

じゃあサーバーとプラグイン何使っているの?

と気になる方もいると思いますので、こちらもご紹介しますね〜

このサイトで利用しているサーバーはMixHost(ミックスホスト)です

このサイトのレンタルサーバーはMixHostの旧スタンダードプラン(月々約980円)を利用しています。

MixHostは以前サーバー落ちが頻繁にあったので、実は「サーバー変えようかな〜?」っと思っていました。

でも最近は安定しているので、月々の値段も安いし、もうしばらく様子見で使っていこうかな?と考えています。

MixHostの場合、キャッシュプラグインの「LiteSpeed Cache」が使えるので、これもスピード早くなった理由な気がします。

【関連記事】WordPressでLiteSpeed Cacheを使用して高速化する方法

\\10日間無料お試しアリ!月々880円//
MixHostのスタンダードプランを申し込む!

このサイトで利用しているプラグインをご紹介!

ではこのサイトで利用しているプラグインもご紹介していきますね〜

  • AddQuicktag
  • Akismet Anti-Spam (アンチスパム)
  • BackWPup
  • Classic Editor
  • Contact Form 7
  • Edit Author Slug
  • EWWW Image Optimizer
  • Jetpack by WordPress.com
  • LiteSpeed Cache
  • Rinker
  • SiteGuard WP Plugin
  • Table of Contents Plus

サイトスピードの対策で利用しているのは、

  • EWWW Image Optimizer(画像圧縮)
  • Jetpack by WordPress.com(画像の遅延読み込みを有効にするをON)
  • LiteSpeed Cache(キャッシュプラグイン)

この3つのプラグインだけです。

 

あと最近は画像をアップロードする前に以下のことを気をつけています。

  • PNGをJPEGに変換する
  • JPEGを圧縮する
  • 大きいサイズの画像は小さくする

前は画像サイズやPNGかなんてを気にしていなかったのですが、こういう地道な努力って大切みたいです。

▽ちなみに圧縮はこれらのサイトを使っています!

まとめ:WordPressテーマ「JIN」は「fontawesomeの読み込みOFF」で高速化が可能!

検証結果としては、WordPressテーマ「JIN」は「FontAwesomeの読み込みOFF」により、サイトの高速化ができました!

今回のアップデートで独自フォントアイコンの実装されたことで、FontAwesomeの読み込みOFFの対策もされています!

使用しているレンタルサーバーやプラグインなども影響があると思いますので、今回ご紹介した内容も踏まえて参考にしていただければと思います!

追記:キャッシュ削除でちゃんとアイコン表示可能

 

キャッシュ削除前

 

アイコンボックスのアイコンや引用タグの「””」が消えたのは、「FontAwesomeの読み込みをOFF」の影響?????

ここは今後対応されるかな?ちょっととりあえず様子見ですね。

kaeru
kaeru
アイコンボックスのアイコンなどが表示できない〜

とつぶやいたら、キャッシュの問題でした。


ひつじさん直々にご返信いただきました!
キャッシュ削除で解消できました!ありがとうございます!

▽アイコン表示できなかったのは、キャッシュ削除で改善できますよ!

注意のアイコンボックス

 

引用タグ