我想知道是否有任何人经历过使用Handlebar.js编译函数的内存泄漏。Handlebar.js IE9中的内存泄漏
我目前正在研究一个单页面应用程序,通过Ajax调用定期从服务器轮询数据。每当我获得新数据时,我都会重新呈现视图。 (我将Backbone.js与handlbar.js结合使用,我知道当我关闭视图或切换到其他视图时,我需要手动释放视图对象,我认为这不是这种情况,至少我认为它关于这个话题,请看这个链接:http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/)< - 我没有完全按照这个方法,但我试图解除所有的事件和数据绑定,并删除所有的引用。
这里是我的代码
// 1. Remove all the old dom
// -- purge all objects
// -- remove dom
Helpers.Purge(this.el); //Purge function is copied from Douglas Crockford's blog
view.empty();
this.compileTemplate(view, viewData, this.model.get("Template"));
// 2. Append the new view
var thisDom = document.getElementsByClassName(this.className);
Helpers.Purge(thisDom);
$(thisDom).remove();
$article.append(this.el);
的this.compileTemplate功能是这样的:
compileTemplate: function (view, data, templateSelector, ratio) {
var templateSource = $(templateSelector).html(),
template = Handlebars.compile(templateSource);
var el = view.html(templateResult);
}
如果我注释掉 “变种EL = view.html(templateResult);”我不会得到内存泄漏问题。只要我取消注释该行,IE 9的内存消耗就开始增加。 (为了测试的目的,我强制每0.5秒重新编译模板。)
我想知道Handlbar.js中是否存在已知的内存泄漏问题,或者是我做错了什么。
非常感谢您提前。
干杯
新的更新:
我试图找出问题,并写了一个小程序,以测试它是否只是handlebar.js IE9上导致内存泄漏。
这是代码。
(function ($) {
function render() {
var templateSource = $("#template").html();
var compileTemplate = Handlebars.compile(templateSource);
var data = {
users: [
{ username: "alan", firstName: "Alan", lastName: "Johnson", email: "[email protected]" },
{ username: "allison", firstName: "Allison", lastName: "House", email: "[email protected]" },
{ username: "ryan", firstName: "Ryan", lastName: "Carson", email: "[email protected]" }
]
};
console.log("before compiling");
var templateWithData = compileTemplate(data);
$("#content").html(templateWithData);
console.log("after compiling");
//this.el = templateWithData;
}
setInterval(render, 500);
})(jQuery);
和HTML代码是在这里:
<!doctype html>
<html lang="en">
<head>
</head>
<body>
<div id="content">
</div>
<!-- JS -->
<script id="template" type="text/x-handlebars-template">
<table>
<thead>
<th>Username</th>
<th>Real Name</th>
<th>Email</th>
</thead>
<tbody>
{{#users}}
<tr>
<td>{{username}}</td>
<td>{{firstName}} {{lastName}}</td>
<td>{{email}}</td>
</tr>
{{/users}}
</tbody>
</table>
</script>
</body>
<script src="js/lib/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="js/lib/handlebars-1.0.0.beta.6.js" type="text/javascript"></script>
<script src="js/complieTemplateWithoutBackbone.js" type="text/javascript"></script>
</html>
IE的内存只是不断攀升不降。有人可以看看这个。
非常感谢。
干杯