array_javascript スキルへの項目追加の JS パフォーマンス分析

配列に項目を追加する 4 つの方法のパフォーマンスを比較しました:

インデクサーを使用して

を追加します

コードをコピーします コードは次のとおりです:

console.time("インデックス");
var a = [];
for (var i = 0, l = 回; i a[i] = i;
}
console.timeEnd("インデックス");

プッシュ方式を使用する

コードをコピーします コードは次のとおりです:

console.time("push");
var a = [];
for (var i = 0, l = 回; i a.push(i);
}
console.timeEnd("push");

concat メソッドを使用する

コードをコピーします コードは次のとおりです:

console.time("concat");
var a = [];
for (var i = 0, l = 回; i a.concat(i);
}
console.timeEnd("concat");

concat メソッドを使用します。パラメータは配列です

コードをコピーします コードは次のとおりです:

console.time("配列と連結");
var a = [];
for (var i = 0, l = 回; i a.concat([i]);
}
console.timeEnd("配列と連結");

時間を 10,000 回に設定します:

コードをコピーします コードは次のとおりです:

インデックス: 0.310ms
プッシュ: 1.476ms
連結: 8.911ms
配列との連結: 2.261ms

時間を 100000 (10 万) 回に設定します:

コードをコピーします コードは次のとおりです:

インデックス: 1.967ms
プッシュ: 11.980ms
連結: 70.410ms
配列との連結: 28.292ms

時間を 1000000 (百万) 回に設定します:

コードをコピーします コードは次のとおりです:

インデックス: 138.559ms
プッシュ: 93.074ms
連結: 608.768ms
配列との連結: 243.371ms

時間を 10000000 (1000 万) 回に設定します:

コードをコピーします コードは次のとおりです:

インデックス: 1473.733ms
プッシュ: 611.636ms
連結: 6058.528ms
配列との連結: 2431.689ms

概要

この結論は Chrome ブラウザにのみ適用されます

concat メソッドの実行効率が最も遅い
2 つの concat メソッドのパラメータの受け渡しと比較すると、パラメータを配列として受け取った場合、パラメータを配列以外として受け取った場合よりも実行効率が高くなります
ほとんどの場合、インデクサーの実行効率はプッシュメソッドよりも高くなります
実行回数が増えると、インデクサーの実行効率がプッシュ方式に比べて劣り始める

ブラウザの比較

私に経験が足りないことを指摘してくれたネチズンに感謝します。ここでブラウザ間の水平比較を追加します

1 つ目は concat メソッドを使用する方法です。IE と Firefox では、パラメータが配列の場合、実行効率は非配列の場合よりも遅くなりますが、大きな差はありません。
その場合、index メソッドと Push メソッドは concat よりも確実に高速です。Firefox では、index メソッドを使用する方が常に高速です。しかし、その差は大きくありません。
3 つのブラウザ間でインデックスとプッシュ メソッドの実行効率を比較すると、Firefox の実行効率は IE や Chrome よりもはるかに高く、基本的には 10 倍高速です。他のブラウザと比較すると、Firefox の実行効率は基本的に 10 倍高速です
。

以下は数百万回の結果です:

コードをコピー コードは次のとおりです:

// Firefox
インデックス: タイマーが開始されました
インデックス: 229.79ms
プッシュ: タイマーが開始されました
プッシュ: 205.12ms
concat: タイマーが開始されました
連結: 2136.99ms
配列と連結: タイマーが開始されました
配列との連結: 2365.18ms
``

コードをコピーします コードは次のとおりです:

//つまり
インデックス: 2,533.744 ミリ秒
プッシュ: 3,865.979 ミリ秒
連結: 4,303.139 ミリ秒
配列との連結: 4,792.208 ミリ秒

この記事は JS のパフォーマンスについてのみ説明しており、比較を通じて JavaScript についての理解を深めていただければ幸いです。