Arrayのjavascriptのパフォーマンス

Question

小さなコードスニペットの2つのバージョンの違いは何ですか？これが何であるかを理解しようとしないでください。これは、パフォーマンスの問題を見つけるために他のすべてのものを削除した後の最終コードです。私にとって

function test(){ 
    var start=new Date(), times=100000; 
    var l=["a","a"]; 
    for(var j=0;j<times;j++){ 
     var result=document.getElementsByTagName(l[0]), rl=result.length; 
     for(var i=0;i<rl;i++){ 
      l[0]=result[i]; 
     } 
    } 
    var end=new Date(); 
    return "by=" + (end-start); 
} 

このスニペットFirefoxで236msがかかりますが、あなたはl[1]=result[i];にl[0]=result[i];を変更した場合にのみ51msかかります。 document.getElementsByTagName(l[0])をdocument.getElementsByTagName(l[1])に変更すると同じことが起こります。両方が変更された場合、スニペットは再び遅くなります。

DevTools/ProfilesでGoogle Chromeを使用した後、低速コードの実行時にtoString関数が追加されています。しかし、私はtoStringを取得する機会がありません。なぜなら、この場合、なぜそれが必要なのでしょうか？

あなたはブラウザの違いが5倍も長くなるように教えてください。

おかげさま上記のコードで

Answer 1

は、要素を検索するためにl[0]を使用しています。その後、再度l[0]と検索を変更します。 2つの使用のうち1つだけ（両方ではない）をl[1]に変更すると、検索する内容が変更されず、パフォーマンスが向上します。

これは、両方を変更すると再び遅くなる理由です。

Answer 2

インデックスの1つだけを0または1に変更すると、コードは同じことをもうやりません。両方のインデックスを変更すると、パフォーマンスは変わりません。

読み取りと書き込みに同じインデックスを使用すると、に格納された値がgetElementsByTagNameへの次の呼び出しで使用され、toStringを呼び出す必要があります。