2011-08-02 10 views
2

私は最近、外部画像ファイルへの画像要求ではなく、私のCSSにbase64データURIを含むように変更しました。大きなサイズのスタイルシートまたはHTTPリクエストを含む小さいバージョン

これは、データのURIが7KBでなく200KB以上のサイズのスタイルシートからサイズが大きくなる問題です。しかし、私ははるかに少ないHTTP要求を持っています。

大丈夫ですか?大規模なスタイルシートのアプローチは、複数の画像リクエストよりも優れていますか?

+0

200KBは圧縮されていないか、圧縮されていますか+ gzipされていますか? – Moses

+0

@Moses - これは圧縮され、gzipされています。 – amateur

答えて

1

200Kbはスタイルシートにとってかなり大きいです。まだ圧縮されていない場合は圧縮して提供していることを確認してください。ほとんどのページでデータ文字列イメージの一部またはほとんどが使用されていない場合は、別のスタイルシートに分割し、必要な場合のみページに含める方がよい場合があります。

0

リクエストが少ないほど良いです。 しかし、ホスティングは特定のダウンロードストリームの接続速度を制限します。したがって、200KBのファイルを2秒以内にダウンロードできる場合は、の2ファイルを1秒でダウンロードできます。 残りはあなたにあります。

追加: 圧縮を使用してサイズを縮小することはできません。画像データを圧縮することはできません。

3

あなたがbase64した画像の合計サイズとスタイルシートのサイズを比較してください。同じかそれより小さい場合、base64 URIを使用すると、スペース(およびダウンロード時間)が少なくなります。一般に、検索されるデータが同一で​​あり、前記要求が同時でない場合、1つの大きな要求が複数のより小さい要求よりも好ましい。

1

文書の先頭(頭の中)にbase64データを除くすべてのスタイルシートを保持するのはどうでしょうか?これにより、素早く読み込まれ、ドキュメントの本文にこれらの初期スタイルの読み込み/表示が開始されます。

次に、イメージをbase64データとして含む文書の最後に(closing/bodyタグの直前に)2番目のスタイルシートを作成します。そうすれば、これがロードされ始めたら、少なくともコンテンツが見え、ほとんどあなたが望むように構造化されます。

Win-win ??

幸運を祈る!

関連する問題