backbone.js で開発されたアプリケーションを使用している場合、AJAX 呼び出しで取得した大きなドキュメントのコンテンツを DOM に追加すると、Chrome が約 7 ～ 10 秒間フリーズします。Chrome のイベント タイムラインは、主な問題が約 6 ～ 8 秒かかる単一の「レイアウト」イベントであることを示しています (問題があれば、最新の MB Air で測定された時間)。
ロードされるコンテンツは、約 800kbs の非圧縮 HTML、15000 の DOM ノード、コンテンツがロードされた後のメモリ使用量は約 30 ～ 35 Mbs です。これは大きなドキュメントですが、このような長いフリーズは適切ではありません。
そのようなドキュメントにこれほど長い「レイアウト」時間がかかるのでしょうか、それとも他の問題の兆候でしょうか? (複雑すぎる CSS ルール、不適切な HTML 構造など)
「レイアウト」イベントのパフォーマンスに影響を与える可能性のあるドキュメント サイズ以外の要因は何ですか?
コンテンツをバラバラに分割するという明白でおそらく正しい解決策に加えて、ブラウザがレイアウトイベントを計算しやすくするためにできるトリックはありますか? (モンスターのコンテンツを iframe や div 内に固定位置で配置したり、コンテンツ内の特定の CSS 機能を回避したりするなどのことを考えています)