概要

なんか速くね?

みろりHP古参の諸兄は、なんかまためちゃ速くなってね? と思われているのではないだろうか。実は今回 Google PageSpeed Insights の点数へ、ガチで取り組んだのだ。以前の点数は v4.26.0 を見ていただくとして (Performance 点数 77 だ)、今回はこちら (Mobile 側)。

マーベラス!

今回の見所というかリリースノート

  • 最初に開いたとき、画面を覆うぐるぐるをやめてみた。代わりに、テーマ画像をぐるぐるさせてみた。何言ってんのか分からないと思うので トップ を見てくれ。
  • 結局、デカいライブラリを読み込むのが時間のロスなのだ。というわけで、 FontAwesome のアイコンを丸ごと読み込むのをヤメて、使っているアイコンのみを読むようにした。
  • 全体的にライブラリをアップデート。 Bootstrap 4 を 5 にアップデートすると、 jQuery が不要になるのだ。いいよね。
  • モバイル側の画像をさらに圧縮したりした。
  • 画像とか JS の遅延読み込みを実装してみた。下の方の画像ってあとでロードすればいいから。

Mobile 側の performance テストって、古い端末を想定してテストしてくれているらしくて、点数を上げるのが結構難しかったぜ。 PC はとっくに満足してるぞ!

おしまい

ページ高速化はオモロイ。 Google PageSpeed Insights がありがたいんだよね。点数を出してくれると指標になって嬉しい。