8

最近、特にモバイル ブラウザーをターゲットにして、HTML5 ゲームを作成するために JavaScript コードの最適化を少し試しています。エンジンの比較から始めて、比較するコードを徐々に単純化したところ、理解できないことがわかりました。

その場合、Chrome (すべての webkit ベースのブラウザーだと思います) でグローバル変数を変更すると、使用メモリが増加することに気付きました。2 つの例を示します。

1) グローバル変数の変更:

コード：

var globalVariable = 0;

var fps = 60;
window.onload = init;

function init () {
   setInterval (loop, 1000/fps);   
};


function loop (){

    for (var i = 0; i < 1000000; i++) {
     globalVariable =  Math.random();
    }
};

メモリータイムラインの画面：メモリ 1

ご覧のとおり、最初の 10 秒間に大量のメモリを収集する必要があります。

2) グローバル変数を変更する代わりにローカル変数を作成する:

コードは同じままです。唯一の変更点は、ループ内にキーワード「var」を追加することです。globalVariable = Math.random(); var localVariable = Math.random(); になります。

メモリータイムラインの画面：メモリ 2

ご覧のとおり、メモリ使用量は非常に低く、最初の 10 秒間は約 0.1MB しか増加しません。

その差は本当に大きいです！今は確認できませんが、Firefox ではどちらの例でもメモリ使用量はほぼ同じに見えるとのことでした。

誰かが私に説明してくれますか、それが説明されているリソースを教えてくれますか? または、使用メモリを増やさないようにグローバル変数を変更する方法を誰かに教えてもらえますか?

4

1 に答える 1

2

(最初に、「グローバル」変数について簡単に説明します。Javascript にはグローバル変数はありません。ウィンドウ レベルのスコープを含むスコープがあります)

しかし、答えは、Javascript の関数で別のスコープから変数にアクセスすると、それが現在のスコープに引き上げられるということです。面白い効果の解説です。

于 2012-12-30T06:53:19.683 に答える