web-dev-qa-db-ja.com

CSSおよびJS URLをバージョン管理する最良の方法は何ですか?

Yahooの大いにバリーフー サイトを高速化するためのベストプラクティス に従って、私たちは、将来のキャッシュ有効期限ヘッダーを使用してCDNから静的コンテンツを提供します。もちろん、これらの「静的」ファイルを時々更新する必要があるため、現在、ファイル名の一部としてインフィックスバージョンを追加します(ファイルの内容のSHA1合計に基づいて)。副<文>この[前述の事実の]結果として、それ故に、従って、だから◆【同】consequently; therefore <文>このような方法で、このようにして、こんなふうに、上に述べたように◆【同】in this manner <文>そのような程度まで<文> AひいてはB◆【用法】A and thus B <文>例えば◆【同】for example; as an example:

styles.min.css

になる:

styles.min.abcd1234.css

ただし、バージョン管理されたファイルの管理は退屈になる可能性があり、GET引数表記がよりクリーンで優れているのではないかと考えていました。

styles.min.css?v=abcd1234

どちらを使用しますか?ブラウザまたはプロキシ/キャッシュに関連する考慮すべき考慮事項はありますか?

26
David Eyk

Googleの Make the Web Faster によると、クエリパラメータを持つページは多くのHTTPプロキシによってキャッシュされません。

ほとんどのプロキシ、特にバージョン3.0までのSquidは、「?」でリソースをキャッシュしません。 Cache-control: publicヘッダーが応答に存在する場合でも、URLに含まれます。これらのリソースのプロキシキャッシュを有効にするには、静的リソースへの参照からクエリ文字列を削除し、代わりにファイル名自体にパラメーターをエンコードします。

したがって、styles.min.abcd1234.cssが推奨されるソリューションです。適切なURL書き換えメカニズムを使用して、styles.min.abcd1234.cssを実装しやすいstyles.min.css?v=abcd1234に透過的に変換できます。

HTTPSのみをサポートしている場合、プロキシは通常SSL経由で提供されるページをキャッシュできないため、このアドバイスは適用されません。

10
Till Ulen

GETスタイルのバージョニングを使用して、空のキャッシュから複数のURL-たとえばstyle.css?v=123style.css?v=456-は同じコンテンツを返します。ただし、これは問題になるとは思えません。特に、一度に1つしかリンクしないためです。

GETスタイルを維持する方がはるかに簡単だと思います。別のファイルは必要ありません。URLを変更するだけで、ブラウザはCSSを新たに取得します。

更新:さらなる調査では、クエリ文字列 ブラウザのキャッシュを停止する可能性があります ファイルを使用しているようです。ただし、Expiresなどの適切なヘッダーを返す場合、これは問題ではありません。

更新2:受け入れられた回答は、一部のプロキシがクエリ文字列でファイルをキャッシュしないことを指摘しています。ただし、これは古い情報に基づいています。彼らがSquidで言及した特定の問題は7年前に修正されました。 Impressive Websは良い記事を書いた これについて。

15
DisgruntledGoat

クエリ文字列はURLの一部と見なされるため、どちらも同じように機能します。クエリ文字列を変更すると、リソースの名前が変更され、ブラウザがファイルの新しいコピーを取得します。

私はあなたが維持するのがより簡単な方法を使用すると言います。

1
John Conde

これは上記の質問の答えではありません、より良い解決策が欲しいので、ここで自分自身に尋ねています

どちらの方法でも、cssファイルとjsファイルが参照されるファイルを変更する必要があります。そのため、実際には、変更を行った後にアプリケーションサーバーを再起動する必要があります。

アプリケーションサーバーを再起動せずに静的ファイルのバージョン管理を処理できるより良い方法はありますか?

以下はソリューションで除外されています

  • cssおよびjsファイル名の変更
  • uRLでクエリパラメータを渡す

また、このソリューションはcache-controlの設定や有効期限に影響を与えてはなりません。

ありがとう

0
Santhosh S