「速さ」は正義であり、収益である

Amazonの調査では、ページの読み込みが0.1秒遅れるだけで売上が1%下がると言われています。 個人のブログでも、表示速度は直帰率に直結します。

1. 画像を最適化する

最大の犯人は大抵「巨大な画像」です。 Next.jsを使っているなら、<img> タグの代わりに <Image /> コンポーネントを使いましょう。 自動的にWebPなどの軽量フォーマットに変換し、サイズを調整してくれます。

2. フォントの読み込み

Google Fontsを使っていますか？ next/font を使えば、ビルド時にフォントファイルをダウンロードしてホスティングしてくれるので、外部への通信が発生せず爆速になります。

3. 第三者スクリプトの遅延

広告やアナリティクスのタグは、ページのメインコンテンツが表示された「後」に読み込むべきです。 next/script の strategy="lazyOnload" を活用しましょう。

計測しよう

まずは Google の PageSpeed Insights で自分のサイトを計測してみましょう。 改善点が具体的に表示されるはずです。