2009-06-10 7 views
3

私は動的に多くのテーブル行を作成するサイトを開発しています。今行の総量は187です。行を作成するときはすべて正常に動作しますが、IEではページを離れるときに大量の遅延があります。私はこれがページ内で何をしているのか、DOMの重い操作にどう関連するのか分かりません。私は動的コンテンツのイベントハンドラを構築するときに関数クロージャを作成しないので、この問題はメモリリークに関連するとは思われません。どんな洞察も大変ありがとうございます。IEで遅いページアンロード

+0

タブを閉じるとラグが発生しますか? –

+0

はありません – ForYourOwnGood

+0

あなたはどんなjavascriptライブラリを使用していますか? – stevedbrown

答えて

1

要素ノードを手作業で作成するのか、innerHTMLを使用して作成していますか?私には分かりませんが、IEにはHTMLノードに関連した独自のメモリリークがあるという疑いがあります。

jQueryを使用してテーブルに187行を追加するデモページを作成しました。私は、jQuery.append()が文字列をノードのセットに変換するために巧妙な小さなトリックを使用すると信じています。 divを作成し、そのdivのinnerHTMLを文字列に設定し、そのdivのすべての子ノードを指定したノードにクローンしてから、最後にdivを削除します。

http://www.andrewpeace.com/stackoverflow/rows/rows.html

私はIE8で任意の遅れが届かない、多分それはあなたが使用しているバージョンに遅れます。もしあなたが私に知らせてくれたらそれが大好きです!たぶん私はもう少しお手伝いできる。

平和

+1

最初にアンカータグを作成した後、そのアンカータグのクリックハンドラを関数クロージャに設定しましたが、IEのガーベッジコレクタは循環参照を認識していないので、 document.createElementを使用して以前に作成したアンカータグにinnerHTMLを設定すると、私はあなたの例が好きですが、あなたのページは単純なテキストです。ページ上に多くのイメージやそのようなものがあります。私の実装に。 – ForYourOwnGood

0

YUI(そしておそらく他のいくつかの人気のJavaScriptライブラリは)automatic listener cleanupを提供していたので、私は非常にIEの問題を最小限に抑えるために、この機能でYUIまたは別のライブラリを使用することをお勧めします。しかし、どのような種類のメモリリークの問題ではなく、単純な遅さが発生しているように思えます。あなたは要素の束にイベントハンドラを添付しています。 IE6は最適化されたものではないことが知られているので、すべてをきれいにするのは永遠に続くかもしれません。

apeaceも良い点があります:innerHTMLはあなたを困惑させ、DOMの奇妙さを設定します。それはJQueryがそのための修正を持っているように思えます。

0

event bubblingを利用して、すべてのイベントハンドラを1つに置き換えるようにしてください。

0

私はporneLに同意します。 1つのイベントハンドラを<テーブル>に接続し、バブリングがその魔法を働かせるようにします。ほとんどのフレームワークは、元のイベント(通常は「ターゲット」と呼ばれます)を引き起こした要素を見つける方法を提供します。

document.createElement()を使用してたくさんの要素を作成している場合は、それらをDOMフラグメントに追加できます。フラグメントをページに追加すると、それに添付されているすべての子ノードが追加されます。この操作は、各ノードを1つずつ追加するよりも高速です。 John Resig氏は、DOM文書の断片について素晴らしい記事を書いています:http://ejohn.org/blog/dom-documentfragments/

関連する問題