グーグル ページ スピード増えた ウェブサイトの トラフィックを 節約して 速度を 高さは 多様な 方法を 提案して, 内 サイトは どうな ガール もっと 適用すると するのか 評価して 与える オンライン サービスだ.

私が 管理する 何 箇所 サイトを 測定して 本 結果 点数は 概して 満足だったが 共通的に 指摘された 蟹 ところで ブラウザー キャッシュを 活用するの ないという 点だった.

ブラウザー キャッシュ 期間を 設定して 与えれば 彼 期間 間は ウェッブブラウザーが 再び オンラインで js私 イメージ ような のを ダウンするの なくて そのまま オフラインに 保存されて ある のを 確実に 使うこと だから トラフィックが 減って, 速度も 増える.

グーグルは キャッシュ 期間を 1年で 設定して 置いて, 内容が 変更される 度に ブラウザーが 鳥で 資源を ダウンする 数 ある 技法(指紋 fingerprint 技法)度 説明して ある.

下は グーグル ページ スピードの 説明である Leverage browser caching 部分を 翻訳した のだ.

要約

静寂な 資源[js私 css, イメージ ような ものなど - 訳者]義 満了日 あるいは 最大 寿命(maximum age)を 指定して おけば ブラウザーは ネットワークで ダウンするの なくて ローカル ディスクに この前に 保存した のを 呼んで 来るように なる.

詳らかに 表示

HTTP/S増えた ブラウザーが 静寂な 資源を ローカルに 臨時 保存(cache. 以後 そのまま あかしなさいと 使う.)割 数 あるように 支援する. いくつか 最新 ブラウザー(IE7, クロム)銀, いくら キャッシュするか 指定されて あるの ない あらゆる 資源を いくら 来ると言う キャッシュするか 自ら 学習を 通じて 決める. 違う 旧式 ブラウザーたちは キャッシュで 資源を インポート 前に ヘッダーに ある キャッシュ 関連 指示を 要求する のだ. そして もう一つの 何人は 初めから SSL[https - 訳者]を キャッシュするの ない.

あらゆる ブラウザーで 一貫されるように キャッシュの 長所を 活用しようとすれば, サーバー 方で キャッシュ 期間を 明確に 設定して, これを 適用する 数 ある あらゆる 資源に 適用するのを 勧める. (イメージ ような) 小さい グループにだけ 指定するの 以外に 言葉だ. キャッシュする に如く 資源には JSわ CSS ファイル, イメージ ファイル, そして 違う バイナリー ファイル(メディア ファイル, PDF野, フラッシュ ファイル 等々)これ ある. 一般的に, HTML銀 静寂であって ない. そのため キャッシュする のを 考慮するの ない 偏移 ましだ.

HTTP/1.1銀 次と ような キャッシュ 回答 ヘッダーを 提供する.

  • Expires わ Cache-Control: max-age. これは 資源が 最新だと 割 数 ある 期間を 決める. ところで, ブラウザーが ウェブ サーバーで 最新 バージョンを チェックするの なくて キャッシュされた 資源を 使う 数 ある 期間を 言う. これらは 無条件 適用される “力強い キャッシュ ヘッダー”だ. すなわち, たいてい 番(回) 満了日が 設定された まま バグれば, 満了日に 到逹するとか 寿命が だ 夏期 前までは 絶対に ブラウザーが GET 要請を 送るの ない.
  • Last-Modified わ ETag. ブラウザーが ファイルが この前と ようか チェックする 数 あるように 文字列を 提供する 方法だ. Last-Modified ヘッダーで これ 文字列は 日付で 表示する. ETag ヘッダーで 文字列は 資源の 最新 可否を 識別する 数 ある ユイルハン どうな 値段だ.(ファイル バージョンや コンデンツ 亥時が 一般的だ.) Last-Modified増えた 人工知能を 取り揃えた ブラウザーに 一年 キャッシュを 使うか ダウンを 受けるか 決める 数 あるように 助ける “弱い” キャッシュ 方法だ.(人工知能 方法は ブラウザー別で 違う.) しかし, これ ヘッダーは 使用者が 明示上に ページを リロードした 時 条件付きで GET 要請を 送ることで キャッシュされた 資源を 效果的に アップデートする 数 あるように する. 条件付き GET 要請は 資源が サーバーで 入れ替えされること 前までは 資源を ダウンロード(full response)夏至 ない. したがって 資源を 皆 ダウンロード(full GETs)する より 引き延ばしが 減る.

あらゆる キャッシュ 可能な 資源に 対して Expires 私 Cache-Control max-age 中 一つ, Last-Modified 私 ETag 中 一つ, [すなわち 強い キャッシュと 弱い キャッシュ 方法 中 一つを] 選択する のが 重要だ. Expires わ Cache-Control: max-age 中 一つを 選択するとか, Last-Modified わ ETag 中 一つを 選ぶ のは 副次的だ.

あらゆる 静寂 資源に 大海 積極的に キャッシュを 設定するのを 勧める

あらゆる キャッシュ 可能な 資源に 大海 次 セッティングを するのを 勧める:

  • 最小 1ヶ月を 満了日で 設定しなさい, そして 後には 1年 位 設定して 紫. (Expires 街 Cache-Control: max-age 見る ましだ. もっと 多い ブラウザーが それを 支援すること だからだ.) 後にも 1年 以上は 設定すれば 中 なるのに, RFC ガイドラインを 違反する ことの だからだ.
    もし 資源が いつ 変わるかを 明確に 分かって あったら, もっと 短い 満了日を 設定しても 良い. するが “すなわち 変更されるかも 分からないのに” する 位なら, 満了日を 長く 設定して, 下で 説明する URL 指紋を 使いなさい. キャッシュを 積極的に 活用する 蟹 ブラウザーを “混乱するように(pollute)” 作るのは ない: 私たちが 分かる たいてい, あらゆる ブラウザーたちは Least Recently Used アルゴリズムに よって キャッシュを 留守にする; 少なくても 私たちが 分かる たいてい 食わず嫌い 満了日を 待ってばかり する ブラウザーは ない.
  • 資源が 変更される 時点で Last-Modified 日付を 設定しなさい. もし Last-Modified 日付が かなり 過去なら, ブラウザーが それを 再び 適用する ない ことだ.(Set the Last-Modified date to the last time the resource was changed. If the Last-Modified date is sufficiently far enough in the past, chances are the browser won’t refetch it.)

指紋を 使って 動的に キャッシュするように しなさい

時たまだけ 変わる 資源に 大海, サーバーで 変更されること 前までに ブラウザーが キャッシュして 置くように 割 数 ある. サーバーが “鳥 バージョンが 出たの” して ブラウザーに 言って くれ 割 数 ある のだ. 資源の URLに 指紋(fingerprint)を 入れて 頭面 そうに 割 数 ある(例を 入れば, ファイル 経路). 資源が 変更されれば, 指紋が 変更されて, そうに なれば URLこれ 変更される. URLこれ 変更されれば, ブラウザーは 当然 資源を 鳥で 適用するように なる. 指紋を 使えば, 資源が 変わる 与えるより ずっと もっと 長く 満了日を 決める 数 ある. 当然, これ テクニックは 外部 資源を 参照して ある ページが 外部 資源の 指紋 URLを 皆 分かって あると する. すなわち, ページが 編まれた 方式に よって 可能な 首都 あって 不可能な 首都 ある.

インターネット エクスプローラを のために Vary ヘッダーを まともに セッティングしなさい

インターネット エクスプローラは Accept-Encoding 科 User-Agent を 除いた 違う フィールドと 一緒に Vary ヘッダーが 送信されれば 彼 資源は キャッシュするの ない.(Internet Explorer does not cache any resources that are served with the Vary header and any fields but Accept-Encoding and User-Agent.) IEで こういう 資源を まともに キャッシュすること ため, Vary ヘッダーで 違う あらゆる フィールドを とり除くとか, 可能だったら Vary ヘッダー 全体を とり除くと する.

[訳者 株: Vary ヘッダーは 何か 多様な 状況に 備えること のために 追加する ヘッダー ようなのに, 何を する やつなのか とても 寝る 理解が なるのは ない. 誰か HTTP 1.1 キャッシュ 関連 ヘッダーを 翻訳して 置いた 蟹 あるのが それを 参考して 紫. 私が 管理する サイトを 見たら Vary:User-Agent,Accept-Encoding して ヘッダーに 書かれて ある. それでは IE度 キャッシュを する ので 理解したが, 後ほど テストを 日 見ると ゲッダ.]

ファイアフォックスで キャッシュ 衝突を 起こす 数 ある URLを 避けると する

ファイアフォックスの ディスク キャッシュ 亥時 関数は 8字 以下の URLに 対して キャッシュ 衝突を 起こす 数 ある. [二] 資源の 亥時が ような 背を 持って あったら, 一つの 資源だけ ディスクに 保存される のだ; [ディスクに] 残っている ような 背の 資源は ブラウザーが 再始作された 時 再び 適用される. したがって もし, 指紋を 使うとか 違う プログラミング 方法で ファイルの URLを 生成して あったら, キャッシュ ヒット率を 最大化すること のために, 8字 以上の URLを 作って ファイアフォックス 亥時 衝突 イシューを 避けなさい.

(訳者 株 : A ファイルと B ファイルが ような 背を 持って あったら, A ファイルが 使われる 方に B ファイルが 適用されるとか する ない ようだ. ただ, A ファイルを キャッシュしてから B ファイルを キャッシュすれば A ファイル キャッシュが 飛ぶ よう.)

ファイアフォックスで HTTPSを キャッシュする 数 あるように Cache control: public 命令を 使いなさい

ファイアフォックス いくつか バージョンでは SSL路 送信された 資源を キャッシュすること のために Cache control: public ヘッダーが 必要だ. 違う キャッシュ ヘッダーが 明確に 指定されて あっても 言葉だ. (下で 説明する ことなのに) 普通は これ ヘッダーが プロキシ サーバーで ともって あるが, プロキシたちは HTTPS路 送信される コンテンツを 全然 キャッシュするの できない. したがって HTTPS 資源に 大海 これ ヘッダーを 層 置く のが 安全だ.

例示

グーグルは 使用者が カレンダーに ログインした 後 使うように なる スタイル シーツ ファイル名に 指紋を 入れて 置いた.

calendar/static/<strong>fingerprint_key</strong>doozercompiled.css, 指紋が ある 所は 128ビート 16真髄だ. 画面を キャプチャした 当時(ページ スピードの Show Resources パネルを ケブツォした のだ), 指紋は 82b6bc440914c01297b99b4bca641a5d 路 設定された.(訳者 株: そのため ファイル名が 82b6bc440914c01297b99b4bca641a5ddoozercompiled.css だ.)

指紋 技法は サーバーが ブラウザーの 要請 日付から 確実に 1年 後を Expires ヘッダーで 送る 数 あるように 日 与える; 終わり ビョンギョングイルを 示す Last-Modified ヘッダーは 確実に 終わり ビョンギョングイルを 示して, Cache-Control: max-age ヘッダーは 3153600載せる. 満了日や 最大 寿命 中に 資源が 変更された 時, 資源を ダウンロードする 数 あるように 夏期 ため, ファイル 内容が 変更されれば 指紋(URL)度 変更される.

もっと 分かって 表示

  • HTTP キャッシュに 大韓 もうちょっと 深み ある 説明は HTTP/1.1 RFC義 セクション 13.2, 14.21, そして 14.9.3 を 見れば なる.
  • アパッチで キャッシュを つけること ための 詳細な 説明は Apache Caching Guide に ある.

- コメント機能はありません。コメントの代わりに[email protected]にメールを送ってください。