Lighthouse のスコアが悪すぎる

[Akatsuka0426]

[tukiminya]

デスクトップ

モバイル

このような結果が出ました。 パフォーマンスに関しては.jpegなどを軽いファイルに変更することが必要だと思います。 news.pngに関してはsvgファイルにしてもよいかと思われます。

[Na9XX-KNSS]

• kr-tukimi さんのおっしゃる通り不透過画像のjpeg,webp化が必要です。

• また、heightとwidthを指定すると無駄な動きを減らせるため表示速度の改善にも繋がります。

• Noto Sans JPフォントのサイズでレスポンスに影響が出ています。

フォント自体のファイルサイズを小さくすることは難しいためオリジンサーバーからではなくGoogleFontApiから取得するようにすることをおすすめします。 <link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&display=swap" rel="stylesheet">

Swiperが使用されているようなのでCDNを活用するのもいいかもしれません。 https://cdnjs.com/libraries/Swiper

パフォーマンスをざっと見る限り画像などのメディア関連に処理が持っていかれてる気がします。 そこらへんだけでも改善すれば高評価を狙えると思います👍

[Akatsuka0426]

jpeg, webp 化はすでに修正済みです（画像を圧縮していい感じにやりました）

フォントはもともと Google Fonts API からやっていましたが、ダウンロードしてみたら多少はパフォーマンスがよくなったので（おそらく）ダウンロードしてサーバーに置いています。Google Fonts API からやったほうがいいですかね？ Swiper も同様です

[Na9XX-KNSS]

jpeg, webp 化はすでに修正済みです（画像を圧縮していい感じにやりました）

それならおっけーです👍

Google Fonts API からやったほうがいいですかね？ Swiper も同様です

実はここらへんが結構微妙なところで、サイト訪問者の環境によって左右されます。 ただ基本はcdnを使うことで表示速度が早くなることが多いですし、遅くなるということはほぼないのでcdnを使用するのがいいと思います。

[Akatsuka0426]

わかりました 取り敢えず CDN 経由に変えておきます