divコンテナは高価ですか？

Question

私は何百ものdivのコンテナで構築されたページを持っています（理由は問いません:)。私はそれがあまりにもエレガントではないことを知っていますが、レンダリングするのはリソースがかかりますか？最適化について心配すべきですか？

Answer 1

divとdivの内容によって異なります。 iPad 1でテストするために12 div深いネスティング、シャドウ、丸みのあるコーナー、css3変換などを作成したので、ナビゲートすると滑らかでした。 70ディビジョンを上回る合計は、何も減速させなかった。過度に複雑なルールではなく、200個までのdivを持つことで、現代のブラウザー/デバイスには本当の問題を引き起こすべきではありません。また、イメージ、複雑な構造などで40 MB以上のページで作業しなければならず、少なくとも数世代前のMac Miniは完全にそれを処理します。

私はそれについてあまり心配しません。しかし、あなたの正確な解決方法にもよるが、これは当てはまらないかもしれないが、div内であまりにも多くのHTML/CSS/JS/Flashの魔法をやろうとしないと、うまくいくはずである。モバイルブラウザの中には異なるものもあります。例えば、ゆっくりとしたアンドロイドは、おそらくそれをスムーズに処理できないでしょう。

Answer 2

高価なdivs自体ではなく、レイアウトをプッシュする内容です。あなたは彼らに何を持っていますか？

また、実際にの経験遅さ？最初に測定し、心配してください。

Answer 3

自分でテストしてください。 Chromeでは、Devツール内のレンダリングタイムラインを見ることができます。多くのdivを半分使ってみて、その違いを見てください。

他の回答に言及すると、内部にあるものともっと関係があります。テキストは簡単です。イメージはそんなにありません。フローティングdivがある場合は、レンダリングエンジンにとってより複雑になります。しかし、Redditのようなサイトのコメントスレッドのhtmlを見ると、何千ものdivを話していますが、非常に素早くレンダリングします。コンテンツをダウンロードするだけで、おそらく10倍の時間がかかります。