2012-03-12 12 views
6

クラスが実際に定義されていない場合、クラスの名前を要素のCSSクラス属性に割り当てることは、ブラウザのパフォーマンスに悪影響を及ぼしますか?存在しないCSSクラス名を適用した場合の影響

JQueryでセレクタにクラス名を使用するのは珍しいことではありません。私は通常、要素を選択するためだけに使用されているクラスを使用し、実際にクラスを決めることは決してありません。

私は、ほとんどのブラウザがCSSクラス定義を探していると仮定しています。スタイルが定義されていれば、何とか短絡して検索できますか?

ページ要素がレンダリングされる前にCSSスタイルがまとめてコンパイルされていることは間違いありません。このため、すべてのCSS定義をまとめてスクリプトタグで分割しないようにすることが重要なのは、他の定義と混在するたびにほとんどのブラウザでCSSを再コンパイルするためです。これが意味するのは、スタイルが適用される前にページをレンダリングできるほど深刻なものである可能性があります。

しかし、実際には、CSSクラスを定義しているかどうかを定義することと、定義しないこととのパフォーマンスの差は無視できます。

+0

私は、クラスを定義しないという効果が不明ですが、あなたが参照しているのと同じ方法でクラスをJqueryで明示的に使用しました。私が持っている唯一の入力は、パフォーマンスではなくユーザビリティです。 Visual StudioなどのIDEを使用している場合は、クラスが決して定義されておらず、Jqueryでのみ使用しようとすると、IDEによってエラーがスローされます。素晴らしい質問btw。 – ityler22

+0

intellisense ...良い点を考えていなかった –

+0

数ヶ月後。この話題は私のマネージャーとのミーティングに現れました。彼は技術的だけどjqueryの技術ではない。尋ねられた。あなたがこれらのクラスを要素に適用するように定義しているのなら...あなたはクラスを正しく定義/適用したことを知っているか?このポイントは、 ASP IDで制御すると、コンパイルエラーが発生します。しかし、Jquery datepicker case 1と2があり、異なるクラスセレクタ(つまり、異なる最小/最大日付)を使用しようとすると、コンパイル時エラーは発生しません。明白なようだが、私の上司が有効な点だった。 –

答えて

6

これについて考えるための最も簡単な方法は、CSSはHTMLではなくCSSセレクタを呼び出すHTMLに適用されることを覚えておくことです。

ブラウザがCSSファイルを解析すると、スタイルを適用する場所を右から左に示すセレクタが読み込まれます。たとえば.foo ul {}は、ページ上のすべてのulタグをチェックし、次にそれらが.foo内に含まれているかどうかを確認します。このように解析されるため、HTMLの余分な未使用クラスは問題になりません。 CSSで指定されているIDとクラスのみをチェックしています。

1

class属性はHTML属性なので、CSSまたはJavaScriptによって呼び出されない場合は問題なく挿入できます。副作用のない、とても楽しく自分でそこに座ることができます。 CSSで選択する必要はなく、JSだけでも使用できます。

この記事では、あなたがより多くを理解するのに役立つかもしれない:

class (HTML attribute) @ sitepoint.com

関連する問題