5種類のWebパフォーマンスの最適化方法

5つのパフォーマンス最適化方法

1.HTTPリクエスト数を減らす

スクリプトファイル統合

2. CSS Sprite

複数の画像を1つの画像ファイルにまとめることにより、所望の画像が存在する画素座標情報、

を用いる.

10個のイメージ(またはアイコン)が必要な場合は、10個のイメージをロードするとパフォーマンスが低下します.

の1つの画像ファイルで実現され、必要な座標で画像を取得する.

.sprite-ps {
	background: url(...);
    background-position: 0 -64px;
    width: 50px;
    height: 50px;
}

3.転送スクリプト圧縮ファイル

httpプロトコルは、ヘッダを介して圧縮方式の情報を交換する.

Webサーバにコンテンツを要求すると、自身がサポートする圧縮アルゴリズムがヘッダに送信される.

により、Webサーバは、アルゴリズムを選択して応答ヘッダに送信することができる.

解凍

4.スクリプトファイルの最小化

スクリプトファイルは、実際の論理に影響を及ぼさない部分(例えば、

注釈、スペース、および後行)を除去することによって低減される.

5.キャッシュの最適化

1)インターネットキャッシュの使用

プロキシサーバキャッシュ

を使用

ユーザー付近のプロキシサーバは、元のサーバよりも応答速度が速い.

分散処理は、

ソースサーバのトラフィックに集約される可能性がある.(=サーバリソースの節約)

2)ブラウザキャッシュの使用

ブラウザは、インターネット上で要求を発行することなく、格納可能なコンテンツをクライアントに格納する.

ブラウザキャッシュを使用するかどうかは、Webサーバによって決定される(応答ヘッダcache-control)

.

参考資料

Webパフォーマンス最適化技術:https://book.interpark.com/product/BookDisplay.do?_method=detail&sc.prdNo=344587219&gclid=Cj0KCQjw29CRBhCUARIsAOboZbJ0ql-oCRK2Euea2ZFFXR0yAYn3HiG6fyndjVpv0Eesg64jbFkpKXsaAprEEALw_wcB2