Web ページがあります: http://uranussup.info。yslow テストを実行しました。多くのリクエスト (20) があり、「コンテンツはキャッシュできません」および「有効期限なし」と表示されます。どうすれば修正できますか?
2 に答える
短縮版
ウェブサイトのコンテンツを異なるHTTP ヘッダーで提供するようにサーバーを設定する必要があります 。
ロングバージョン
Yahoo! から Web サイトを高速化するためのベスト プラクティス:
Expires または Cache-Control ヘッダーを追加する
このルールには 2 つの側面があります。
Expires
静的コンポーネントの場合: 遠い将来のヘッダーを設定して、「期限切れにならない」ポリシーを実装します。- 動的コンポーネントの場合: 適切な
Cache-Control
ヘッダーを使用して、条件付きリクエストでブラウザを支援しますWeb ページのデザインはますますリッチになっています。つまり、ページ内のスクリプト、スタイルシート、画像、および Flash が増えています。ページへの初めての訪問者は、いくつかの HTTP 要求を行う必要がある場合がありますが、Expires ヘッダーを使用することで、それらのコンポーネントをキャッシュ可能にします。これにより、後続のページ ビューでの不要な HTTP リクエストが回避されます。Expires ヘッダーは画像で最もよく使用されますが、スクリプト、スタイルシート、Flash コンポーネントを含むすべてのコンポーネントで使用する必要があります。
ブラウザー (およびプロキシー) は、キャッシュを使用して HTTP 要求の数とサイズを減らし、Web ページの読み込みを高速化します。Web サーバーは、HTTP 応答の Expires ヘッダーを使用して、コンポーネントをキャッシュできる期間をクライアントに伝えます。これは遠い将来の Expires ヘッダーであり、この応答が 2010 年 4 月 15 日まで古くならないことをブラウザーに伝えます。
Expires: Thu, 15 Apr 2010 20:00:00 GMT
サーバーが Apache の場合、ExpiresDefault ディレクティブを使用して、現在の日付に相対的な有効期限を設定します。この ExpiresDefault ディレクティブの例では、リクエスト時から 10 年後の Expires 日付を設定します。
ExpiresDefault "access plus 10 years"
遠い将来の Expires ヘッダーを使用する場合は、コンポーネントが変更されるたびにコンポーネントのファイル名を変更する必要があることに注意してください。ヤフーで!多くの場合、このステップをビルド プロセスの一部にしています。バージョン番号は、コンポーネントのファイル名に埋め込まれています (例: yahoo_2.0.6.js)。
遠い将来の Expires ヘッダーを使用すると、ユーザーがサイトにアクセスした後にのみページ ビューに影響します。ユーザーが初めてサイトにアクセスし、ブラウザのキャッシュが空の場合、HTTP リクエストの数には影響しません。したがって、このパフォーマンス改善の影響は、ユーザーがプライミングされたキャッシュを使用してページにアクセスする頻度によって異なります。(「プライミングされたキャッシュ」には、ページ内のすべてのコンポーネントが既に含まれています。) これは Yahoo! で測定しました。プライミングされたキャッシュを使用したページ ビューの数は 75 ~ 85% であることがわかりました。遠い将来の Expires ヘッダーを使用することで、ユーザーのインターネット接続を介して 1 バイトも送信せずに、ブラウザーによってキャッシュされ、後続のページ ビューで再利用されるコンポーネントの数を増やします。
これでうまくいくはずですが、「mod_expires.c」か「mod_expires.so」かはわかりません - 現時点ではどちらも機能していません。
<IfModule mod_expires.so>
ExpiresActive On
ExpiresDefault "access plus 4 hours"
ExpiresByType application/javascript "access plus 2 months"
ExpiresByType application/javascript-x "access plus 2 months"
ExpiresByType text/javascript "access plus 2 months"
ExpiresByType image/jpg "access plus 2 month"
ExpiresByType image/jpeg "access plus 2 month"
ExpiresByType image/gif "access plus 2 month"
ExpiresByType image/png "access plus 2 month"
ExpiresByType text/css "access plus 2 months"
ExpiresByType text/html "access plus 2 months"
ExpiresByType text/xml "access plus 2 months"
ExpiresByType text/plain "access plus 2 months"
ExpiresByType image/x-icon "access plus 12 month"
ExpiresByType image/icon "access plus 12 month"
ExpiresByType application/x-ico "access plus 12 month"
ExpiresByType application/ico "access plus 12 month"
</IfModule>