在IE9 Handlebar.js内存泄漏 [英] Handlebar.js Memory leak in IE9

查看:121
本文介绍了在IE9 Handlebar.js内存泄漏的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆