在IE9 Handlebar.js内存泄漏 [英] Handlebar.js Memory leak in IE9
问题描述
我使用Handlebar.js编译功能,想知道如果任何一个经历了内存泄漏。
I am wondering if any one has experienced memory leak from using Handlebar.js compile function.
我目前工作的一个单页应用程序,它定期轮询从通过Ajax调用服务器上的数据。每次当我拿到新的数据的时候,我重新渲染视图。 (我与handlbar.js结合使用Backbone.js的。我知道我需要手动自由视图对象时,我关闭视图或切换到其他的观点,我觉得是不是这里的情况。至少,我认为它。是不是对于这个话题,请参阅此链接:<一个href=\"http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/\" rel=\"nofollow\">http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/) &LT; - 我还没有完全遵循的方法,但我试图解除所有的事件和数据,并删除所有引用
I am currently working on a single page app which polls data periodically from server via Ajax call. Every time when I get new data, I re-render the view. (I am using Backbone.js in conjunction with handlbar.js. I understand that I need to manually free view objects when I close the view or switch to other view, I think that is not the case here. At least, I think it is not. Regarding to this topic please see this link: http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/) <-- I have not exactly follow the approach, but I tried to unbind all the events and data, and remove all the references.
下面是我的code
// 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功能是这样的:
The this.compileTemplate function is like this:
compileTemplate: function (view, data, templateSelector, ratio) {
var templateSource = $(templateSelector).html(),
template = Handlebars.compile(templateSource);
var el = view.html(templateResult);
}
如果我注释掉VAR EL = view.html(templateResult);我不会得到内存泄漏问题。当我取消这条线,在IE 9的内存消耗开始募集。 (我迫使视图重新编译该模板每0.5秒用于测试目的。)
If I comment out "var el = view.html(templateResult);" I won't get memory leak issue. As soon as I uncomment this line, the IE 9 memory consumption start to raise. (I am forcing the view to re-compile the template every 0.5 seconds for testing purpose.)
我想知道是否有在Handlbar.js一个已知的内存泄漏问题,或者是我做错了。
I would like to know if there is a known memory leak issue in Handlbar.js or it is something I am doing wrong.
非常感谢你在前进。
干杯
新的更新:
我试图找出问题,并写了一个小程序来测试它是否只是handlebar.js IE9上导致内存泄漏。
I tried to isolate the problem, and wrote a tiny program to test whether it was just handlebar.js causing memory leaks on IE9.
下面是code。
(function ($) {
function render() {
var templateSource = $("#template").html();
var compileTemplate = Handlebars.compile(templateSource);
var data = {
users: [
{ username: "alan", firstName: "Alan", lastName: "Johnson", email: "alan@test.com" },
{ username: "allison", firstName: "Allison", lastName: "House", email: "allison@test.com" },
{ username: "ryan", firstName: "Ryan", lastName: "Carson", email: "ryan@test.com" }
]
};
console.log("before compiling");
var templateWithData = compileTemplate(data);
$("#content").html(templateWithData);
console.log("after compiling");
//this.el = templateWithData;
}
setInterval(render, 500);
})(jQuery);
和HTML code是在这里:
And the HTML code is here:
<!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的内存只是不断攀升不降。可有一个人请看看这个。
The memory of IE just keep climbing up and never goes down. Can some one please have a look at this.
非常感谢你。
干杯
推荐答案
刚刚情况下,任何一个有同样的问题。
Just case any one is having same issue.
我都有种解决了这个问题。我没有在结尾处使用车把的。我切换到KnockOut.js这是MVC4包的一部分。
I have kind of resolved this problem. I didn't use handlebar at all in the end. I switched to KnockOut.js which is part of MVC4 package.
淘汰赛与IE浏览器很好的工作,但没有淘汰赛的映射插件(插件来帮助你映射的JavaScript对象),所以我不得不手动对象的每个字段绑定。这是没有太多的额外工作。我很高兴用KnockOut.js解决了内存泄漏。
KnockOut worked nicely with IE, but not KnockOut's Mapping plugin (a plugin to help you to map javascript object), so I had to bind each field of an object manually. It wasn't too much extra work. I am glad using KnockOut.js resolved the memory leak.
希望车把社会将解决未来的内存泄漏问题。
Hopefully, Handlebar community will resolve the memory leak issue in future.
这篇关于在IE9 Handlebar.js内存泄漏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!