ページのアクセス速度の最適化（D）
- フロントエンドの最適化
I.概要
主にHTTPリクエストを減らすことによって、フロントエンドを最適化し、非リアルタイム非同期、キャッシュ、ファイル圧縮、変更を要求CDNのように加速、独立した画像サーバとを。
第二に、縮小HTTPリクエスト
1、HTTPのオーバーヘッド
HTTPリクエストには、リソースを取るドメイン名解決、TCP接続を確立する要求を送信し、そのような解決要求などの結果、ダウンロードリソース、待機します。
そのため、HTTPリクエストを減らすために、ページのアクセス速度を最適化するのに役立ちます。
2、地図
そのような連続的ないくつかのボタンのような複数の画像については、各ボタンが小さい画像です。画像は1枚ずつロードされている場合、我々は、これらの画像ファイルを取得するために、それぞれ、複数のリクエストを送信する必要があります。
ここでは、これらの画像は異なる与えられた、ローカライズを実現するために、<エリア>、一の画面に、そしてCSS <マップ>と組み合わせることができる効果的要求の数を減少させる、別の位置にジャンプするリンクをクリックしてください。
第三に、非同期要求
例えば、紙のトラフィックを記録するなど需要の少ないリアルタイム要求、のためのロードが完了した後、あなたは、ページを入力することができますし、サーバーのアヤックスに送信され、統計、することができます。同期は、時間を節約し、待つ必要はありません。
第四に、キャッシュ
ブラウザのキャッシュとバッファ層nginxのキャッシュに。
1、ブラウザ
ブラウザのキャッシュがローカルキャッシュとキャッシュ相談、ブラウザにキャッシュされているローカルキャッシュに分割され、キャッシングネゴシエーションがサーバーにキャッシュされます。
1）ローカルキャッシュ
キャッシュからHTTPステータスコード200のローカルキャッシュ、ローカルにキャッシュされたヘッダを設けてもよい、フィールドは、キャッシュ制御され、無店舗含まないパラメータ（キャッシュを無効に）、非キャッシュ（相談キャッシュを可能にする、ローカル・キャッシュを無効にする）、最大エージング= xxxは（ローカルキャッシュが最大時間を秒単位で設定します）。
2）相談キャッシュ
HTTPネゴシエーションステータスコードキャッシュは変更しない304、ブラウザのローカルキャッシュがヒットしない、またはキャッシュ制御フィールドには、キャッシュを設定されていない場合、サーバーにコンテンツを要求するブラウザ、およびレスポンスヘッダ内のテープヘッド指紋ファイルを（変更後変更される）のいずれも、一致しない場合、パラメータは、変更した場合-先月、修飾発現しました。
サーバーのパラメータは、交渉を持つサーバーのキャッシュかどうかを判断し、その結果をクライアントに返し、最初のパラメータに応じてもたらす、最終-変更される最後の要求の時間を表し、サーバーの指紋は、ETagのにこの文書を表します。ブラウザはそれらを格納し、次のリクエストに応じてパラメータを送信します。
2、nginxの
nginxの等最初の位置、キャッシュの内容を一致させる必要、例えばJS、CSS、JPG、PNG、に、キャッシュ時間を設定することができ、その後、提供内部位置の有効期限が切れる= 30Dを、30日間のバッファを表します。
このように、ファイルと同じ名前の内容は、ファイルが変更された場合、通行のパラメータは、このようなxxx.jsのxxx.js？A = 1、そうするファイル名として、キャッシュを回避するために使用することができ、30日間、30日間キャッシュされますこのキャッシュをスキップします、nginxのは、ファイルをキャッシュします。
第五に、ファイル圧縮
1、縮小化
JS、CSSファイル、ファイルは静的なので、あなたは、ブラウザを減らすためにファイル圧縮を使用することができますので、応答時間を高速化するために、ファイルサイズをダウンロードする必要があります。
ファイル圧縮ファイルのJSの複数に押し込むことができるツールを、縮小化することができ、かつ自動的空間圧縮のように、ラップれる、圧縮後のファイルサイズは、通常、元の約40％です。
2、GZIP
縮小化に加えて、あなたはまた、さらにファイルを圧縮、gzip形式を使用することができます。gzipは原理が使用、ファイルを圧縮ハフマン木がするのjs、cssの一部頻繁に文字の代わりに、非常に短いと、長いと変数を使用し、還元性を備え、代わりにその内容を保証することができます。
したがって、GZIPは、コンテンツの内容のマッピング関係の圧縮と解凍を記録するために辞書を維持します。
Gzip圧縮した後、ファイルは約30％に低減されます。
、セクションのnginxの構成サーバーを追加する必要があるで、gzip_buffers（クライアントに送信される、すなわち、パケットサイズ）を含むいくつかの他のパラメータに加えて、追加のgzip gzip圧縮をONに示す圧縮、gzip_comp_level（圧縮レベル、必要な大規模な、より強力な圧力が、CPUを消費）、gzip_min_length（このファイルは圧縮されていないよりも少ないバイト）、gzip_types（圧縮されたファイルタイプのセット）。
圧縮した後、開発者モードでブラウザを更新、あなたはファイルがロードされて見ることができ、コンテンツのエンコーディング：gzipで、圧縮された成功を示しています。
動的なファイルは、通常、これらの操作を行うことはできませんが通常、JS、CSS、画像は、圧縮してキャッシュする必要があります。
六、CDN
1.目的
CDNの加速度は、静的ファイルを読み込むスピードアップを目指しています。
2、原則
呼び出さCDN、コンテンツ配信ネットワークユーザは、インテリジェントDNS解決を介して、要求を送信した場合、原則的に各ネットワークの実際の位置であり、サーバノードが配置されているが、位置の決意は、選択されたアクセスネットワークオペレータのIP、種類、に基づくことができます最短ルート、軽い負荷、要求、および店舗IPを持つサーバー。
要求すべきコンテンツが存在しない場合、サーバーのサーバーは、それが実店舗コードファイル要求に移動し、要求キャッシュの結果だろう。オーバー返送さらに要求は、プロセスが直接結果を返します。
七、画像サーバ
一般的に、画像は一緒に別のサーバーではなく、コード、データベース、NoSQLのピア・サーバーを展開する必要があります。画像サーバーの負荷大、低速の要求は、このように確立し、I / Oの多くを取るので、単一のサーバが保証する他のサービスに影響を与えることはできません。
複数の画像サーバは、ファイルシステムを構築するためにfastDFSツールを使用することができた場合、画像サーバを管理します。