IE11 appendChild/removeChild 内存泄漏答案

【问题标题】：IE11 appendChild/removeChild memory leakIE11 appendChild/removeChild 内存泄漏
【发布时间】：2016-03-25 03:18:38
【问题描述】：

我遇到了一个问题，我创建了一个网格，该网格通过使用文档片段并在将其附加到 div 之前向其附加元素来动态构建。我注意到 appendChild 和 removeChild 似乎导致内存泄漏。我创建了一个 jsfiddle 来演示这一点。我确保浏览器的所有插件都被禁用（我没有太多开始）。如果您在单击运行时打开开发人员工具栏 (F12) 并分析内存，您会注意到内存会增加。每次点击它，内存就会增加。就好像垃圾收集永远不会发生一样。如果代码有问题，请指出。我还尝试在附加变量后将变量的值设置为 null，并尝试删除，但它们没有任何区别。

https://jsfiddle.net/k75ypb76/6

html:

<div id="grid">

</div>

<button id="btnRun">
  Run
</button>

CSS：

#grid{
  height: 250px;
  width: 500px;
  overflow: scroll;
  border: 1px solid #000000;
}

.row{
  border: 1px solid #ff0000;  
}

.cell{
  display: inline-block;
  width: 40px;
  background-color: #00ff00;
}

JS：

function run(){
    var grid = document.getElementById('grid');

    //create the grid 20 times
    for(var i =0; i < 20; i++){
        var doc = document.createDocumentFragment();
        //clear out the grid
        while (grid.firstChild) {
            grid.removeChild(grid.firstChild);
        }
        //create 300 rows
        for(var x = 0; x < 300; x++){
            var row = document.createElement('div');

            row.className = 'row';
            //create 10 cells per row
            for(var y = 0; y < 10; y++){
                var cell = document.createElement('div');

                cell.className = 'cell';    
                cell.textContent = x + '-' + y;

                row.appendChild(cell);
        }

        doc.appendChild(row);
        }

        grid.appendChild(doc);
    }
}

var btnRun = document.getElementById('btnRun');

btnRun.addEventListener('click', run);

谢谢，希望有人能帮忙解决这个问题。

【问题讨论】：

我曾尝试在将单元格、行和文档添加到其父级后删除它们，但这无济于事。我还尝试将它们的值设置为 null 或 undefined，但这仍然不起作用。我希望一旦函数完成后不久 GC 就会进入并清理，但事实并非如此。我还注意到，当我在页面之间导航时，内存仍然存在。
IE 版本为 11.20.10586.0 更新版本：11.0.26 (KB3104002)

标签： javascript memory-leaks internet-explorer-11 ie11-developer-tools

【解决方案1】：

当您删除Child 时，没有从内存中删除的内容会返回 - IE 和 EDGE 以外的浏览器似乎足够聪明，可以看到您没有使用返回值并为您清理。

供参考： https://github.com/mootools/mootools-core/issues/2225

【讨论】：

感谢您的回复。我之前看到过那个帖子，但这并不能解决问题。此外，您的示例引发错误（抱歉）。还在寻找。
是的，在我发布之后，我注意到了这个错误，所以我删除了“解决方案”。但是我留下了我学到的信息，因为我在几个不同的地方找到了它，并认为它至少是有教育意义的，如果不是真的有用的话。我很高兴您找到了解决方案，但令人沮丧的是它无法通过 javascript 代码修复。我无法想象必须告诉客户他们必须编辑注册表才能让他们的浏览器工作是多么糟糕。

【解决方案2】：

好的，这很有趣。 Windows 7、8、8.1 上的 IE11 中存在拼写检查器的已知问题。有一个修补程序已发布，并在刚刚发布的 12 月 8 日更新中。但是，这显然不适用于 Windows 10。问题仍然存在。我现在得到的修复是编辑注册表：

[HKEY_CURRENT_USER\SOFTWARE\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_SPELLCHECKING] "iexplore.exe"=dword:00000000

希望这对其他人有所帮助。

【讨论】：

显然有一个适用于 Windows 7、8 和 8.1 的修补程序，而不是适用于 Windows 10。我还没有尝试过这些，因为我在 Windows 10 上运行，但是如果你使用它可能会对你有所帮助其他人：support.microsoft.com/en-us/kb/3119070