IE中使用Angular Directive增加内存总量

时间：2016-04-04 09:38:32

标签： angularjs angularjs-directive memory-leaks internet-explorer-11 microsoft-edge

目前我在IE 11下运行角度代码时遇到问题。由于Angular渲染嵌套的ng-repeat非常慢（即使使用单向绑定），我想出了使用指令进行渲染的想法其他<td>元素没有添加任何不必要的观察者。

我做了一个模拟我正在经历的问题的傻瓜。指令代码如下： https://plnkr.co/edit/MNtShl6iWGFoXBHP2jmM?p=preview 

.directive('tdRenderer', function($compile, $filter) {
            return {
                restrict: 'A',

                link: function(scope, element) {

                    var row = scope.row;
                    var htmlElements = '';
                    angular.forEach(row.rowData, function(column) {
                        var dataValue = $filter('typeFormatter')(column);
                        htmlElements += '<td class="nowrap" ng-click="dataTableController.rowClicked($index)">' + dataValue + '</td>';
                    });
                    htmlElements = $compile(htmlElements)(scope);
                    element.append(htmlElements);
                }
            };
        });

我刚刚使用随机值来模拟通常通过REST服务加载的数据，并添加了一个过滤器，就像我在现实世界中所拥有的那样。

在IE开发工具中，我已经在REST调用之前和之后创建了堆快照，并且我可以告诉我正在正确清理堆。偶尔我会看到几个字节差异+/-但是总内存不断增加。

在我将“track by”子句添加到ng-repeat后，情况有所改善，如果关键数据没有改变，则内存停止增加。然后它可以非常愉快地进行轮询，如果来自服务器的数据没有改变，则总内存不会增加。在我的生产代码中，例如，当您对列进行排序时，数据是新的，然后每次加载新数据时我开始看到增加大约3MB。几个小时后，IE达到2GB的限制，然后通常会崩溃。数据量相当小 - 大约是30k，所以我不知道它为什么会增加3MB。

我还尝试在编译函数中重写此指令，并在pre函数中尝试将我的元素设置为null或编写.html（''）以尝试清理，这两者都没有帮助。在这一点上，一切似乎都指向了tdRenderer指令。我甚至试图取出$ filter但我不知道我还能做些什么来确保清理和释放所有内容。

我在Chrome或FF中没有看到相同的行为。只是IE（Edge也受到影响）

任何建议都将不胜感激

1 个答案:

答案 0 :(得分：1)

IE11和Edge中存在内存泄漏：

  

请注意，在调试时我注意到即使在www.google.com等页面上，内存也会一直增长。因此，为了验证问题，我一直在使用系统监视器进行测试，并在那里查看ram用于选项卡的内容。关闭选项卡将释放内存。

<强>参考

相关问题
最新问题