CSSを1つのファイルに結合することになっていることは誰もが知っていますが、サイトごとまたはページごとですか?私は両方の長所と短所を見つけました。
シナリオは次のとおりです。
- 大規模サイト
- CSSファイルはグローバルスタイル用に1つのファイルに分割され、モジュール用に多数に分割されます
解決策A:サイト全体のすべてのCSSファイルを1つのファイルに結合します。
最良の部分は、最初のヒット後に1つのファイルがすべてのページにキャッシュされることです。欠点は、名前空間の衝突の可能性が高くなるにつれて、セレクター(クラスとID)の命名規則がより重要になることです。また、同じモジュールを別々のページで異なるスタイルにするためのシステムも必要です。これにより、CSSに追加のセレクターが作成され、ブラウザーにとってより多くの作業が必要になります。これにより、メモリと処理能力がそれほど多くないiPadなどのモバイルデバイスで問題が発生する可能性があります。レスポンシブデザインにメディアクエリを使用している場合、追加のスタイルを追加すると、さらに問題が複雑になります。
解決策B:ページテンプレートごとに1つのCSSファイルを結合します。
(ページテンプレートとは、1つのレイアウトを意味しますが、記事ページのように多くの異なるページを意味します)このシナリオでは、上記の選択に関する問題のほとんどが失われますが、キャッシュの利点の一部も失われます。この手法の最悪の部分は、2つの異なるページテンプレートに同じスタイルがある場合、ページごとに1回ずつ、2回ダウンロードされることです。たとえば、これはすべてのグローバルファイルで発生します。:(
概要:
したがって、プログラミングで一般的であるように、どちらの解決策も完璧ではありませんが、誰かがこれに遭遇して答えを見つけた場合は、それを聞いてみたいです!特に、ソリューションAのセレクターの問題に役立つテクニックを知っている場合。