ブログ
最終更新日 2024年 01月 15日 | 2 分で読める
開発者のおすすめ
開発するページの高速オペレーションのために
- 次世代フォーマットで画像を配信する。
WebPやAVIFのような画像フォーマットは、PNGやJPEGよりも優れた圧縮を提供することが多く、ダウンロードの高速化とデータ消費量の削減を意味します。 -
画像を効率的にエンコードする。 - 最適化された画像は読み込みが速く、モバイルデータの消費量も少なくなります。
- サーバーの初期応答時間を短縮する。
他のリクエストはすべてメインドキュメントに依存しているため、メインドキュメントのサーバーレスポンスタイムを短くしましょう。 - 未使用のJavaScriptを減らす。
未使用のJavaScriptを減らし、スクリプトの読み込みを必要な時まで延期することで、ネットワークアクティビティによって消費されるバイト数を減らします。 - 画像のサイズを適切にする。
モバイルデータを節約し、ロード時間を改善するために、適切なサイズの画像を提供します。 - 巨大なネットワークペイロードを避ける。
大きなネットワークペイロードはユーザーの実質的なコストとなり、長いロード時間と高い相関関係があります。 - 効率的なキャッシュポリシーで静的アセットを配信する。
長いキャッシュ寿命は、ページへのリピート訪問をスピードアップすることができます。 - ウェブフォント読み込み中もテキストが表示されるようにします。
フォント表示CSS機能を活用することで、ウェブフォントの読み込み中もテキストがユーザーから見えるようになります。 - サードパーティのコードの影響を軽減します
サードパーティのコードは、読み込みパフォーマンスに大きな影響を与える可能性があります。冗長なサードパーティプロバイダの数を制限し、ページの読み込みが主に終了した後にサードパーティのコードを読み込むようにしましょう。 - スクロールのパフォーマンスを向上させるためにパッシブリスナーを使用しないでください。
ページのスクロールパフォーマンスを向上させるために、タッチやホイールのイベントリスナーをパッシブにすることを検討しましょう。 - メインスレッドの作業を最小限に抑えます。
JavaScriptの実行時間を短縮します。
JSの解析、コンパイル、実行にかかる時間を減らすことを検討してください。より小さなJSペイロードを配信することが有効です。 - 過剰なDOMサイズを避けます
大きなDOMはメモリ使用量を増やし、スタイル計算を長引かせ、コストのかかるレイアウトのリフローを発生させます。 - 重要なリクエストの連鎖を避けます
ページロードを改善するために、チェーンの長さを短くしたり、リソースのダウンロードサイズを小さくしたり、不要なリソースのダウンロードを延期したりすることを検討してください。