在window.unload的Javascript内存泄漏清理内存、window、unload、Javascript

2023-09-11 01:28:40 作者:我想抱抱你

JavaScript客户端应用程序。

Javascript client side application.

努力消除内存泄漏导致丑陋(至少可以这样说)code。

Trying to eliminate memory leaks leads to ugly (to say the least) code.

我试图清理window.unload而不是在搞乱了所有的code试图避开他们。

I am trying to clean up in window.unload instead on messing up all the code trying to avoid them.

我们大多使用 element.onevent =功能(){...}; 模式,即导致封(主要是想)和内存泄漏

We use mostly element.onevent=function(){..}; pattern, that results in closure (mostly wanted) and memory leak.

我们不使用JavaScript框架。

We do not use javascript frameworks.

有没有关于如何正确清理退出任何想法?

Are there any ideas on how to clean up properly on exit?

有没有人做同样的或者是你想避免呢?

Has anyone do the same or are you trying to avoid them?

推荐答案

最好的解决办法是给你推出自己的方法来管理事件处理。因此,附加一个事件处理程序时,你的方法可以跟踪所有添加的事件。在卸载,它可以注销所有的处理程序。

The best solution is for you to roll out your own method that manages event handling. Therefore, when attaching an event handler, your method can keep track of all the added events. On unload, it can unregister all the handlers.

我知道你说你不使用的库,但你可以用自己的code为灵感。 EXT-JS的确,当你使用Ext.EventMgr.addListener。

I know you said you don't use libraries, but you can use their code as inspiration. Ext-js does that when you use Ext.EventMgr.addListener.

下面是一个简单的EvtMgr OBJ,你可以用上手。这是非常简单的,我不会写这一切,你在这里。随意问的事情,你想,不知道该怎么办的问题。另外请注意,我不会用element.onclick方法,因为你只能添加一个处理程序。我做的,那是因为你说那是你如何做到这一点。

Here's a simple EvtMgr obj that you can use to get started. It's very simplistic, I can't write it all for you here. Feel free to ask questions about things that you'd like and don't know how to do. Also note that I wouldn't use the element.onclick method since you can only add a single handler. I'm doing it that way because you said that's how you do it.

var EvtMgr = (function(){
  var listenerMap = {};

  // Public interface
  return {
    addListener: function (evtName, node, handler) {
      node["on" + evtName] = handler;
      var eventList = listenerMap[evtName];
      if (!eventList) {
        eventList = listenerMap[evtName] = [];
      }
      eventList.push(node);
    },

    removeAllListeners: function() {
      for (var evtName in listenerMap) {
        var nodeList = listenerMap[evtName];
        for (var i=0, node; node = nodeList[i]; i++) {
          node["on" + evtName] = null;
        }
      }
    }
  }
})();

此外,要注意,有关闭句柄不是创造泄漏的唯一方法。见我的评论对这个问题的http://stackoverflow.com/questions/1077840/javascript-memory-leaks-after-unloading-a-web-page/1886359#1886359

另外,我不明白为什么有些人怕库。 jQuery是微小的,内线核心是太。如果你使用他们不理解的js他们可能是危险的。但是,如果你的js技能扎实,你通过重复使用他们的code节省了大量的工作。我的EXT-JS每一天的引擎盖下获得,当我需要了解有些事情做。这就是我如何给你的code这几行。

Also, I don't understand why some people are afraid of libraries. jquery is tiny, ext core is too. They can be dangerous if you use them without understanding js. But if your js skills are solid, you save a lot of work by reusing their code. I get under the hood of ext-js every single day when I need to understand how somethings is done. This was how I gave you these few lines of code.

另一种认为要想想当管理内存泄漏是确保您删除从DOM(node.innerHTML或任何其他方式)元素时,删除处理。如果你这样做,你应该从你的DOM已经删除的节点中删除处理程序。还有一些工作得到了工作,但它应该是你的战略的一部分。

Another think to think about when managing memory leaks is to make sure you remove handlers when removing elements from the DOM (node.innerHTML or any other way). If you do that, you should remove handlers from the nodes you've removed from the DOM. There's some work to get that working but it should be part of your strategy.