2008-06-20 (金)
■ innerHTML がメモリリークを引き起こす例
先日悩んでいたメモリリークの原因が判明しました。 Ajax とは無関係で、innerHTML を使って書き換えていたのが良くなかったみたいです。 メモリリークを起こしていたのは、こういうコードの箇所です。 （本当は <ul>〜</ul> の部分は Ajax で読み込んだテキストが入ります。）
toggle: function(event) {
var element = event ? event.target : window.event.srcElement;
if (element.nodeName == "LI") {
element.innerHTML += "<ul><li>dummy</li></ul>";
}
},
これを、次のように createElement と appendChild を使って書き換えると、 メモリリークを回避できました。
toggle: function(event) {
var element = event ? event.target : window.event.srcElement;
if (element.nodeName == "LI") {
var ul = document.createElement("ul");
ul.innerHTML = "<li>dummy</li>";
element.appendChild(ul);
}
},
クロージャや循環参照が原因となるパターンとは違うと思うので、 なぜメモリリークになっていたのか、よく分からないのですが、
このページで解説されている「クロスページ リーク」に該当するのかもしれません。 でも、さらに試してみると、最初のコードをもっと単純に、
......
element.innerHTML = "dummy";
......
のようにしてもメモリリークするようです。 やっぱりよく分かりません。
このエントリの続き: 2008-07-28 (月)
[コメントを書く]
本日のリンク元
- 5 google検索(javascript innerhtml)
- 4 google検索(javascript メモリリーク)
- 3 google検索(innerHTML メモリーリーク)
- 3 google検索(IE メモリリーク 循環参照)
- 3 google検索(innerHTML メモリリーク)
- 3 google検索(innerHTML メモリリーク)
- 3 google検索(メモリーリーク 原因)
- 3 google検索(メモリリーク PHP)
- 3 google検索(javascript メモリリーク)
- 3 google検索(クロージャ メモリリーク)
- 2 google検索(メモリリーク innerhtml)
- 2 google検索(メモリリークパターン)
- 2 google検索(javascript null メモリ)
- 2 google検索(t)
- 2 google検索(t)
- 2 google検索(php メモリリーク)
- 2 google検索(javascript メモリリーク)
- 2 google検索(innerhtml メモリリーク)
- 2 google検索(innerHTML メモリ)
- 2 google検索(javascript event.target)
- 2 google検索(ajax IE メモリリーク)
- 2 google検索(innerhtml メモリリーク)
- 2 google検索(PHP メモリリーク)
- 2 google検索(javascript 循環参照 メモリリーク)
- 2 google検索(toggle:function(event))
- 2 google検索(svg innerHTML)
- 2 google検索(svg メモリ)
- 2 google検索(javascript innerHTML)
- 2 google検索(javascript innerHTML メモリリーク)
- 2 google検索(javascript イベント リーク)
- 2 google検索(javascript メモリリーク 原因)
- 2 google検索(innerhtml IE メモリ)
- 2 google検索(innerHTML メモリ)
- 2 google検索(ie メモリリーク innerHTML)
- 2 google検索(JavaScript 循環参照 リーク)
- 2 google検索(JavaScript メモリ)
- 2 google検索(メモリリーク javascript 原因)
- 2 google検索(innerhtml 書き換え)
- 2 google検索(javascript innerHTML IE)
- 2 google検索(javascript event.srcElement)
- 2 google検索(JavaScript メモリーリーク)
- 2 google検索(JavaScript メモリリーク)
- 2 google検索(クロージャー メモリーリーク)
- 2 http://www.google.co.jp/hws/search?hl=ja&q=SVG メ�...
- 2 msn検索(javascript InnerHTML)
- 1 http://www.revulo.com/PukiWiki/Plugin/AjaxTree.htm...
- 1 google検索(split メモリリーク)
- 1 google検索(ajax メモリ)
- 1 google検索(javascript 1メモリーリーク)
- 1 google検索(ajaxとinnerHTML)
- 1 google検索(IE8 メモリリーク)
- 1 google検索(メモリリーク 例)
- 1 google検索(javascript リーク)
- 1 google検索(javascript メモリリーク internet explorer)
- 1 google検索(innerHTML リーク クロージャ)
- 1 google検索(innerHTML リーク)
- 1 google検索(ajax innerHTML リーク)
- 1 google検索(XMLHttpRequest メモリーリーク)
- 1 google検索(JavaScript createElement ul)
- 1 google検索(innerHTML)
- 1 google検索(event.srcElement)
- 1 google検索(php メモリリーク)
- 1 google検索(jquery メモリリーク)
- 1 google検索(jQuery innerHTML ie)
- 1 google検索(Javascript メモリリーク)
- 1 google検索(javascript innerHTML イベント)
- 1 google検索(innerHTML)
- 1 google検索(appendchild メモリリーク)
- 1 google検索(JAVASCRIPT innerHTML)
- 1 google検索(クロスページ リーク)
- 1 google検索(IE メモリリーク)
- 1 google検索(javascript innerhtml)
- 1 google検索(javascript 1メモリーリーク)
- 1 google検索(javascript メモリーリーク)
- 1 google検索(javascript event メモリリーク)
- 1 google検索(JavaScript メモリーリーク)
- 1 google検索(vmwear centos メモリ)
- 1 google検索(jQuery innerHTML は)
- 1 google検索(php リーク)
- 1 google検索(クロスページ リーク)
- 1 google検索(IE javascript innerHTML)
- 1 google検索(javascript innerhtml メモリ)
- 1 google検索(メモリリーク ajax)
- 1 google検索(php 5.2.5 メモリリーク)
- 1 google検索(innerhtml メモリリーク)
- 1 google検索(svg メモリーリーク)
- 1 google検索(javascript メモリリーク)
- 1 google検索(JavaScript メモリリーク)
- 1 google検索(t)
- 1 google検索(t)
- 1 google検索(t)
- 1 google検索(t)
- 1 google検索(t)
- 1 google検索(ul innerhtml)
- 1 google検索(javaScript メモリリーク)
- 1 google検索(jquery メモリリーク)
- 1 google検索(javascript createElement メモリ)
- 1 google検索(DirectX メモリリーク)
- 1 google検索(vm ware メモリリーク)
- 1 google検索(ruby メモリーリーク split)
