1

我想知道是否有人因使用 Handlebar.js 编译功能而经历过内存泄漏。

我目前正在开发一个单页应用程序，该应用程序通过 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);
}

如果我注释掉“var 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: "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代码在这里：

<!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的内存一直在往上爬，从不往下掉。有人可以看看这个。

非常感谢你。

干杯

4

1 回答 1

1

以防万一有人遇到同样的问题。

我已经解决了这个问题。最后我根本没有使用车把。我切换到 KnockOut.js，它是 MVC4 包的一部分。

KnockOut 与 IE 配合得很好，但不是 KnockOut 的 Mapping 插件（一个帮助您映射 javascript 对象的插件），所以我不得不手动绑定对象的每个字段。这不是太多额外的工作。我很高兴使用 KnockOut.js 解决了内存泄漏。

希望 Handlebar 社区将来能解决内存泄漏问题。

于 2012-08-06T21:42:00.017 回答