【发布时间】：2013-03-09 11:45:53
【问题描述】：
我使用ng-include来切换不同的数据页面，这会做大量的数据渲染。
我发现浏览器的内存使用量一直在增长，而且永远不会回落。
代码
代码很简单。
HTML 代码：
<body ng-controller="MainCtrl">
<div>
<button ng-click="url='nodata.html'">No data</button>
<button ng-repeat="i in getNumArray(10)" ng-click="loadData(i)">Load data {{i}}</button>
</div>
<hr/>
[{{url}}]
<div ng-include="url"></div>
</body>
它将显示一个“无数据”按钮，以及用于加载不同页面的 10 个数据按钮。
角码：
app.controller('MainCtrl', function($scope) {
$scope.url = "nodata.html";
$scope.loadData = function(n) {
$scope.url = "data" + n + ".html";
}
$scope.getNumArray = function(n) {
var arr = [];
for(var i =0;i<n;i++) {
arr.push(i);
}
return arr;
}
});
app.controller('DataCtrl', function($scope, $http){
$http.get('data.json').success(function(data){
$scope.data = data;
})
});
还有“dataN.html”页面：
<div ng-controller="DataCtrl">
<table ng-repeat="x in getNumArray(500)">
<tbody>
<tr>
<td>{{data["key0"]}}</td>
<td>{{data["key1"]}}</td>
<td>{{data["key2"]}}</td>
<td>{{data["key3"]}}</td>
<td>{{data["key4"]}}</td>
<td>{{data["key5"]}}</td>
<td>{{data["key6"]}}</td>
<td>{{data["key7"]}}</td>
<td>{{data["key8"]}}</td>
<td>{{data["key9"]}}</td>
</tr>
</tbody>
</table>
</div>
“nodata.html”页面：
<div>No data yet.</div>
还有“data.json”：
{
"key0": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key1": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key2": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key3": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key4": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key5": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key6": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key7": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key8": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f",
"key9": "sdf sdf sdf sdf sdf sdf sdf sdf sdf sd fds fds fsd fds fds fds fds fsd fds fds f"
}
这是一个现场演示：
http://plnkr.co/edit/KGZVXIBws1kthgN2bxEJ?p=preview
当我用chrome打开live demo时，初始化内存使用量小于100M。然后我点击“加载数据”按钮，它很快就会增长到300M并且永远不会回退，即使我点击“无数据”按钮加载“nodata.html”。
正常吗？ ng-include 有内存泄漏还是我遗漏了什么？还是内存使用没问题我不用担心？
截屏
我创建了一个截屏视频来展示它：
【问题讨论】：
-
你在使用 chrome 扩展 Angular Batarang 吗？它倾向于使具有大数据的角度应用程序表现得非常缓慢。也尝试在它自己的窗口上运行它。 Plnkr.co 的记忆力不是很好
-
我安装了
Angular Batarang，但没有启用它。我也尝试过使用干净的 chrome 和 firefox，两者都有同样的问题。我使用 plnkr.co 方便地演示这个问题，您可以下载源代码在您自己的计算机上进行测试。