のようなセレクターです
.a, .b, .c, .d, .e, .f, .g, .h, ......... , .zzzzz {font-size:16px}
パフォーマンスに悪いですか?はいの場合はどのように、いいえの場合はなぜですか?
私はグーグルでMozillaの投稿を含む多くの投稿を読みましたが、セレクターとして多数のクラス名が悪いという言及は見つかりませんでした。
のようなセレクターです
.a, .b, .c, .d, .e, .f, .g, .h, ......... , .zzzzz {font-size:16px}
パフォーマンスに悪いですか?はいの場合はどのように、いいえの場合はなぜですか?
私はグーグルでMozillaの投稿を含む多くの投稿を読みましたが、セレクターとして多数のクラス名が悪いという言及は見つかりませんでした。
いいえ、パフォーマンスの問題はありません。
悪いのは、多くのチェックを伴う長いセレクターですが、実際にはセレクターは一連のセレクターであり、
.a {font-size:16px}
.b {font-size:16px}
...
クラスだけを持つセレクターは、最も効率的なセレクターの 1 つです。
コードをより簡単に管理するためにクラスを少なくする必要がある場合でも、実際の問題はありません。
一口保存するのは良いことです。@dystroyが言ったように、ページのパフォーマンスにはそれほど影響しませんが、コーディングの粒子としては適切ではなく、コードの管理も困難です。
次のように書きます。
body{font-size:16px}
これは、一度に複数のクラスに共通のプロパティを割り当てるための有効な構文です。ダウンの副作用はありません。
大きなセレクターを選択したのではなく、スタイルシートに多くのセレクターを割り当てただけです。大きなセレクターは、たとえば次のようになります。
header nav ul li a
ブラウザは右から左にセレクターを使用するため、キーセレクター(行の最後のセレクター、この例ではアンカー要素a)は一般的すぎます。スタイルのレンダリングを開始すると、ブラウザーはキーセレクターに従ってすべての要素を取得し始めます。これはおそらく、効果的に必要な場合に、はるかに多くの要素を取得したことを意味します。この例では、ナビゲーションアイテムが一意のクラスを取得する場合ははるかに優れているため、スタイルシートは次のセレクターにのみ適用する必要があります。
.primary-link
したがって、レンダリング時間を最小限に抑えるために、スタイルに適したキーセレクターをインポートします。
CSSセレクターとパフォーマンスについて興味深いことを読みたい場合は、そのページをお勧めします:http: //learn.shayhowe.com/advanced-html-css/performance-organization