Question

我正在开发一个在iframe中呈现内容的嵌入式系统。它使用signalR（基于ajax）和jquery。随着时间的推移，浏览器变得越来越慢，内存使用量也越来越高。所以我希望消除所有潜在的内存问题。

当新页面加载到iframe中时，我会附加点击和焦点事件处理程序。

在iframe页面被替换之前，我取消附加它们。

但是，如果我检查$ .cache（在使用firefox的PC上进行测试时，所以与我的真实系统完全不同），每次重新加载iframe时，仍会显示$ .cache获得越来越多的元素。

这是正确的做事方式吗？还有什么我可以尝试的吗？为什么$ .cache会增长？

（如果你有兴趣我使用带有Midori浏览器的raspberry pi（运行linux），尽管我可以选择其他（主要是web-kit）浏览器。）

我用来更改iframe内容的Javascript ...

hubProxy.client.loadPage = function (pageFilename, pageType) {
    frameNode = $("#myIframe").contents();
    $("a", frameNode).off();  
    $("#myIframe")[0].src = pageFilename;
};

Answer 1

写一个包装器div来保存你的iframe容器，例如......

<div id="myIframeWrapper"></div>

现在您可以在上一个iframe页面之后进行清理，这可以通过完全清除DOM中与前一个iframe相关的所有内容，然后在调用loadPage函数时使用构造函数创建一个新的iframe来完成。

hubProxy.client.loadPage = function (pageFilename, pageType) {

    var myNewIframe = '<iframe id="myIframe" src="' + pageFilename + '"></iframe>';

    // Remove old iframe from the DOM and replace with new iframe
    if ($("#myIframe")) {
        $("#myIframeWrapper").empty().append( myNewIframe );
    }

    var frameNode = $("#myIframe").contents();
    $("a", frameNode).off();
};

您会注意到已删除了分配iframe源的原始行，因为它已在新构造函数中进行了说明。这样做的好处是可以使用构造函数添加其他iframe属性，例如iframe大小等。

避免内存泄漏将内容加载到iframe中

1 个答案: