JavaScript でよくあるメモリリーク-jsチュートリアル-php.cn

JavaScript でよくあるメモリリーク

Mary-Kate Olsen

リリース： 2025-01-08 14:35:40

オリジナル

919 人が閲覧しました

Common Memory Leaks in JavaScript

1.グローバル変数

グローバル変数はアプリケーションの存続期間中存続し、ガベージコレクションされることはほとんどありません。変数のスコープが適切に設定されていないと、偶発的なメモリリークが発生する可能性があります。

function myFunc() {
    globalVar = "I'm a memory leak!";
}

ログイン後にコピー

2.切り離された DOM ノード

削除された DOM ノードは、JavaScript で参照される場合、表示されなくなった場合でもメモリ内に残ることがあります。

let element = document.getElementById("myElement");
document.body.removeChild(element); // Node removed but still referenced

ログイン後にコピー

3.タイマーとコールバック

setInterval と setTimeout はコールバックと変数への参照を保持するため、長時間実行されるアプリケーションでメモリリークが発生する可能性があります。

let intervalId = setInterval(() => {
    console.log("Running indefinitely...");
}, 1000);

// Clear when no longer needed
clearInterval(intervalId);

ログイン後にコピー

4.クロージャ

クロージャは外部関数からの変数への参照を意図せず保持し、メモリの問題を引き起こす可能性があります。

function outer() {
    let bigData = new Array(100000).fill("data");
    return function inner() {
        console.log(bigData.length);
    };
}

ログイン後にコピー

ここでは、内部は、不要になった場合でも bigData を保持します。

メモリリークを防止および修正するための戦略?

1.グローバル変数を最小限に抑える

不必要なメモリの永続化を避けるために、変数にはローカルスコープ (関数またはブロック) を使用します。

2.切り離された DOM ノードへの参照をクリア

削除された DOM ノードを参照する変数が null に設定されていることを確認します。

document.body.removeChild(element);
element = null; // Clear the reference

ログイン後にコピー

3.タイマーとイベントリスナーを管理する

特に動的シングルページアプリケーションの場合は、不要になったタイマーを常にクリアし、イベントリスナーを削除してください。

let timer = setInterval(doSomething, 1000);
// Clear when no longer needed
clearInterval(timer);

ログイン後にコピー

4.可能な限り大規模な閉鎖を避けてください

クロージャの範囲を最小限に抑えるか、コードを再構築して、大規模なデータ構造を不必要に保持しないようにします。

お役に立てば幸いです。読んでいただきありがとうございます。 ?
つながりましょう！私を見つけるには:

以上がJavaScript でよくあるメモリリークの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。