21

私は同じことを読み続けます：

「プロパティ値を DOM 要素に直接格納することは、メモリ リークの可能性があるため危険です。」

しかし、誰かがこれらのリスクをより詳細に説明できますか?

4

2 に答える 2

16

（属性によって、DOM要素のプロパティを参照していると思います。）

DOM要素のカスタムプロパティは安全ですか？

一部のブラウザは、破棄されたときにDOM要素を適切にクリーンアップしていません。したがって、他の要素、同じ要素、または大量のデータセットへの参照が保持され、リークが発生しました。これは、新しいブラウザでほぼ解決されていると思います。

いずれにせよ、要素に少量のデータを保存することは無害であり、非常に便利な場合があるので、その警告を一粒の塩で受け止めてください。

jQueryを使用するの.data()は安全な代替手段ですか？

特にありません。jQueryのカスタムデータストアを使用してデータを保存すると、メモリリークが発生する可能性がありますが、残念ながら、古いブラウザに影響を与えるだけではありません。

.data()リークを回避するには、要素を破棄するときに要素を確実にクリーンアップする必要があります。これは、jQueryを使用して要素を破棄する場合は自動的に行われますが、破棄しない場合は、すべてのブラウザーに影響を与えるメモリリークが発生します。

リークを引き起こす可能性のあるいくつかの例は何ですか？

要素に.data()リンクされたものがたくさんあるとしましょう。#foojQueryメソッドを使用して要素を削除すれば、安全です。

$("#foo").remove(); // associated .data() will be cleaned automatically

しかし、これを行うと、クロスブラウザ互換のリークが発生します。

var foo = document.getElementById("foo");
foo.parentNode.removeChild(foo);

または、#foojQueryなしでコンテンツがクリアされている他の要素の子孫である場合、同じ問題になります。

otherElement.innerHTML = "";

どちらの場合も、jQueryは削除#fooに使用されなかったため.data()、要素から完全に関連付けが解除され、アプリケーションにリークが発生します。

では、DOM APIを直接使用しない場合でも、安全ですか？

安全ですが、これが発生する可能性のある別の方法は、複数のDOM操作ライブラリをロードする場合です。jQueryは、次のコードでこれを行うのに役立つと考えてください。

var $jq = jQuery.noConflict();

これで、または$を参照できるようになり、jQueryは。によって参照されます。prototypejsmootools$jq

問題は、それらの他のライブラリがjQueryによって設定されたデータをクリーンアップしないことです。なぜなら、それらはそれについて知らないからです。

したがって、jQueryにいくつかのデータが#fooあり、mootoolsその要素を破棄するために使用される場合、メモリリークが発生します。

.data()jQueryで使用したことがない場合はどうなりますか？それは私を安全にしますか？

悲しいことに、違います。jQueryは同じ.data()メカニズムを使用して、イベントハンドラーなどの他のデータを格納します。したがって、.data()一部のカスタムデータを要素に関連付けるためにを呼び出さない場合でも、上記の例が原因でメモリリークが発生する可能性があります。

ほとんどの場合、リークに気付かないかもしれませんが、コードの性質によっては、最終的には問題になるほど大きくなる可能性があります。

于 2012-10-09T15:18:08.873 に答える
12

jQueryのドキュメントによると：

バージョン9より前のInternetExplorerでは、.prop（）を使用してDOM要素のプロパティを単純なプリミティブ値（数値、文字列、またはブール値）以外に設定すると、プロパティが削除されない場合（.removeProp（を使用）にメモリリークが発生する可能性があります。 ））DOM要素がドキュメントから削除される前。メモリリークなしでDOMオブジェクトに値を安全に設定するには、.data（）を使用します。

于 2012-10-09T15:17:51.033 に答える