[解決済み】Amazon CloudFrontからS3経由でgzip圧縮されたCSSとJavaScriptを提供する。

質問

サイトの読み込みを速くする方法を探していますが、その1つにCloudfrontの活用があります。

CloudfrontはもともとカスタムオリジンCDNとして設計されておらず、gzipをサポートしていなかったため、私はこれまですべての画像のホストに使用してきました。画像はサイトコード内のCloudfront cnameで参照され、far-futuresヘッダーで最適化されています。

一方、CSSとjavascriptのファイルは自分のサーバでホストしています。これまで、Cloudfrontからgzipで提供できないという印象があり、gzipによる利益（約75％）がCDNの使用による利益（約50％）を上回ると考えていたからです。Amazon S3（そしてCloudfront）は、ブラウザがgzip圧縮のサポートを示すために送信するHTTP Accept-Encodingヘッダを使用することにより、標準的な方法でgzip圧縮コンテンツの提供をサポートしていなかったため、その場でGzipしてコンポーネントを提供することができなかったのです。

このように、今までは2つの選択肢のどちらかを選ばなければならないという印象を持っていました。

1. すべてのアセットをAmazon CloudFrontに移動し、GZippingのことは忘れてください。

2. コンポーネントをセルフホスティングしておき、入ってくるリクエストを検知してその場でGZippingを行うようにサーバーを構成します。

そこで でした。 この問題を解決するための回避策ですが、基本的には以下の通りです。 うまくいかなかった . [ リンク ].

さて、Amazon Cloudfrontはカスタムオリジンをサポートしているようで、その カスタムオリジンを使用している場合、gzip形式のコンテンツを提供するために標準のHTTP Accept-Encodingメソッドを使用することが可能になりました。 [ リンク ].

私のサーバーでは、今のところ新機能を実装できていません。 上にリンクしたブログ記事は、私が見つけたこの変更に関する唯一のものですが、カスタムオリジンを選択した場合のみ、gzipを有効にできる（回避策もあるが、私はそれを使いたくない）ことを示唆しているようです。私は、自分のCloudfrontサーバでcorespondingファイルをホストし、そこからリンクする方が簡単だと思います。ドキュメントを注意深く読んだけど、よくわからない。

• この新機能は、ファイルを独自ドメインのサーバーでホストすることを意味するのかどうか。 を経由して もしそうなら、どのようなコード設定でこれを実現できるのか。

• css と javascript のヘッダーを設定して、Cloudfront から gzip で提供されるようにする方法。

解決するには？

UPDATEしてください。 Amazonがgzip圧縮に対応したため、不要になりました。 アマゾンからのお知らせ

オリジナルの回答です。

答えは、CSSとJavaScriptのファイルをgzipで圧縮することです。はい、その通りです。

gzip -9 production.min.css

これは production.min.css.gz . を削除します。 .gz を設定し、S3（または使用している任意のオリジンサーバー）にアップロードし、明示的に Content-Encoding ヘッダを gzip .

これはオンザフライのgzipではありませんが、非常に簡単にビルド/デプロイメントスクリプトに包むことができます。その利点は

1. ファイルが要求されたときにApacheがコンテンツをgzipするためにCPUを必要としない。
2. ファイルは最高圧縮レベルでgzip圧縮されます(仮定) gzip -9 ).
3. CDNからファイルを配信している。

CSS/JavaScriptファイルが（a）最小化されており、（b）ユーザーのマシンで解凍するのに必要なCPUを正当化できるほど大きいと仮定すると、ここでかなりのパフォーマンスを得ることができます。

CloudFrontにキャッシュされているファイルを変更する場合は、この種の変更を行った後、必ずキャッシュを無効にしておくことを忘れないでください。