setInterval javascript内存泄漏答案

【问题标题】：setInterval javascript memory leaksetInterval javascript内存泄漏
【发布时间】：2011-06-16 08:31:36
【问题描述】：

我无法弄清楚为什么内存在增加，并且每次运行此代码时它都停留在那里：

easingFunction = function (t, b, c, d) {
    if ((t /= d / 2) < 1) return c / 2 * t * t * t * t * t + b;
    return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
}
processFrame = function () {
    for (var i = 0; i < tiles.length; i++) {
        var tile = tiles[i];
        tile.percent += 4;
        if (tile.percent > 0) {
            var TH = Math.max(0, Math.min(TILE_HEIGHT, targetObj.height - tile.imageY));
            var TW = Math.max(0, Math.min(TILE_WIDTH, targetObj.width - tile.imageX));
            var SW, SH, SX, SY, amount;
            draw.save();
            draw.translate(tile.imageX, tile.imageY);
            if (direction == "tb" || direction == "bt") {
                amount = easingFunction(tile.percent, 0, TW, 100);
                SW = Math.min(TW, amount);
                SH = TH;
                SX = 0;
                SY = 0;
            } else {
                amount = easingFunction(tile.percent, 0, TH, 100);
                SW = TW;
                SH = Math.min(TH, amount);
                SX = 0;
                SY = 0;
            }
            draw.drawImage(copycanvas, tile.imageX, tile.imageY, SW, SH, SX, SY, SW, SH);
            draw.restore();
        }
    }
    var ok = true;
    for (i = 0; i < tiles.length; i++) {
        if (tiles[i].percent < 100) {
            ok = false;
            break;
        }
    }
    if (ok) {
        clearInterval(interval);
        showComplete();
    }
};
this.show = function (target, hideTarget) {
    createTiles();
    for (var i = 0; i < tiles.length; i++) {
        var tile = tiles[i];
        tile.percent = 0 - i * 10;
    }
}
var intervalDelay = (config.duration * 1000) / (tiles.length * 3 + 25);
interval = setInterval(function () {
    processFrame();
}, intervalDelay);
};

function Tile() {
    this.imageX = 0;
    this.imageY = 0;
    this.percent = 0;
};
};

我遗漏了一些不重要的代码。想法是我在外部调用 show() 函数。 setInterval 被初始化并运行 processFrame() 大约 100 次。

我试图在 processFrame 之外留下一些代码，但我必须：

processFrame = function () {
    for (var i = 0; i < tiles.length; i++) {
        var tile = tiles[i];
        tile.percent += 4;
    }
    var ok = true;
    for (i = 0; i < tiles.length; i++) {
        if (tiles[i].percent < 100) {
            ok = false;
            break;
        }
    }
    if (ok) {
        clearInterval(interval);
        showComplete();
    }
};

但是内存还是会增加。

【问题讨论】：

我看不出您的代码有任何根本性的错误。内存增加了多少，您如何衡量以及您使用的是什么 JavaScript 引擎？众所周知，浏览器会泄漏一些内存，并且有很多方法可以测量...
我正在使用 firefox 进行测试，每次调用 show() 时，内存都会增加大约 2-3 Mb RAM。我正在使用任务管理器进行测量，遵循 Firefox 进程。

标签： javascript memory-leaks setinterval

【解决方案1】：

尝试使用 JSLint 验证您的代码。 http://www.jslint.com/

现在您将 easingFunction 和 processFrame 添加到 Global 对象（这不是一件好事）。并不是这就是问题的原因，但我发现我的对象管理不善是内存泄漏的常见原因。

你会想做这样的事情：

var MyObject = {}; 

MyObject.easingFunction = function(){};
MyObject.processFrame = function(){};

简而言之，请确保在使用之前使用var 声明所有对象。

【讨论】：

【解决方案2】：

我发现了问题。我不断地重新绘制画布。为了解决这个问题，我必须在每次修改之前擦除画布。

【讨论】：