画像周り
Webpを使う
主要ブラウザはすべてwebp対応しています。
基本的にすべてWebpにしてください。
時間がない場合は、MVなど容量の大きい画像だけでも実施してください。
下記ページで実施します。
効果：大
適切な画像サイズに変更
スマホ画像の横幅を700pxから500pxほどにすると、かなり容量を削れます。
タブレットで見ても大きな違和感はないと思います。
気になるならタブレット用の画像を用意しましょう。
効果：中
script/CSS周り
scriptをページの下で読み込み
Gtagなど、指定があるものを除いてすべてページ下部で読み込みましょう。
効果：中
不要なWebフォントを読み込まない
※これも基本はページ下部で読み込みましょう。
NG
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP&family=Noto+Serif+JP:wght@100;200;300;400;500;600;700;900&display=swap" rel="stylesheet">
OK
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP&family=Noto+Serif+JP:wght@400;700&display=swap" rel="stylesheet">
通常文字と太字だけなら、400と700だけで問題なし。
それ以外の太さを使いたい場合は、パフォーマンスを押してでも使うべきか、考えること。
効果：大
minify化
下記ツールなどを使い、スクリプトやCSSファイルを圧縮しましょう。
ただしバージョン管理とは相性が悪いので、1点でもパフォーマンスを上げたいケースだけで良いと思います。
効果：小
その他
無駄な記述の削除
不要な文字やコメントはできるだけ減らしましょう。
効果：極小
エラーの解消
無駄なスクリプトの読み込みを無くす意味だと効果アリです。
エラー自体は直接的な効果はほぼないですが、エラーは限りなくゼロを目指しましょう。
効果：？