-
1:ID:8bB6sz · 2週間前

#質問 スプライトについて質問です。

1. HTTP/2が用意できる本番環境である場合、CSSスプライトは無意味でしょうか?
2. 全ページで使いまわすようなアイコンは、SVGスプライトよりも、HTMLインラインで用いたほうが通信的には良いでしょうか?

6 件の回答

2:ID:s/gvYi · 2週間前

アイコン関係はほぼCSSスプライトにしてるね。
まれに単品の画像にしているのもあるけど、よく使うのはCSSスプライトにしてる

3:ID:XbDK2k · 2週間前

HTTP2が正しく使えているならスプライトにする意味はないね

4:ID:X9ZnkZ · 2週間前

1.
無意味というより、逆に遅くなってしまうケースすらありそう。少し考えてみるとわかるんと思うんだけど、巨大な1ファイルをダウンロードするのと、巨大なファイルを50分割してダウンロードするとでは、どちらが速いと思う?パラレルダウンロードできる範囲なら、パラレルダウンロードが有利であることは間違いないよね。

2.
頭で思考してなさそうな質問だな。
SVGが仮にそこそこの容量のものだった場合、全ページその容量増えるわけだから、容量次第では、圧倒的に不利になるよね。額面通り考えるなら、使い回す場合は、1ファイルを共有したほうがお得。ただ、例外があるだけ。


学問的に通信速度を高める知識は有用だとは思うけれど、現場ではクソほどの役にも立たないぞ。一般的なWebサイトでは、よほど下手に作らない限り、http2でないといけないとか、スプライトしないとつらいとか、そんなことにはならないよ。

5:ID:y7.Cns · 2週間前

無意味っす

6:ID: · 2週間前

Re:4
頭で思考していないというか、HTTP/2の知識が浅いため、質問させてもらってます。

> 巨大な1ファイルをダウンロードするのと、巨大なファイルを50分割してダウンロードするとでは、どちらが速いと思う?

当然分割されているほうが有利に思えるのですが、限度とか、同時通信が増えることによる副作用みたいなことがないものか、気になった次第です。

この理屈でいえば、アセットは細かく分割すればするほど良い、ってことになりますよね…
逆にスプライトではなく、画像も分割して配信すれば表示速度があがるとか…(昔、そういう手法ありましたよね)

> SVGが仮にそこそこの容量のものだった場合、全ページその容量増えるわけだから

これもすごく気になっていて、イラレで作り込んだイラストなどはデータ量も多く、インラインで読み込む意味が見いだせないため、外から読み出したほうがよいかな、と。

> 学問的に通信速度を高める知識は有用だとは思うけれど、現場ではクソほどの役にも立たないぞ。一般的なWebサイトでは、よほど下手に作らない限り、http2でないといけないとか、スプライトしないとつらいとか、そんなことにはならないよ。

全くごもっともでして、今、自社サイトを静的サイトとして作っています。せっかくの自社サイトなので、高速化を極められるところまで極めてみようぜ、ってノリで探求しているところでございます。

7:ID:X9ZnkZ · 2週間前

Re:6
同じようなことを宣言するが、それは夏休みの自由研究以上の価値を持たないことを自覚すること。
その上で、まず、ページ高速化はそれなりに深いので、ゴールを設定することをおすすめする。「理論上早くなる仕組みの考察」が目的なのか、「エンドユーザー体験向上」が目的なのかを明確に線引すべき。
圧倒的なアクセスをさばくサービスでない限り、理論上の高速化はコードゴルフにしかならない。
ちなみに、「どれくらい分割するのが妥当か」という解は、アクセス状況とサーバーのチューニング次第
なので、一概に表現できない部分。

そして、一番気になったのは、WEBサイトとSPAを混同しているということ。
それら2つの高速化の概念は異なるわけで、コメントを読む限り、混ざってるね。

コメントの受付は終了しました。

一緒に読まれている質問

ページ上部に戻る