Firefoxのfor速度比較が遅すぎると思ったので試してみた(2019/05版)
以前試したJSのループ実行結果、まだちょこちょこアクセスがあったようなので少し条件を変更して最新ブラウザバージョンで再実行してみました。
まとめ
ブラウザ | ループ処理の速度 |
---|---|
Chrome | for = for-of << reduce << forEach <<<<<<< map |
Firefox | for < reduce < forEach << for-of < map |
Safari | for = reduce < forEach < map << for-of |
Edge | for << forEach < for-of = reduce < map |
Chrome、Firefox、Safari共にグローバル変数の操作は少し遅め。Edgeはほとんど変わらないが、そもそも操作自体が全体的に遅いので(ry
全てのブラウザにおいて普通のforでループを回すのが最速で、それ以外の処理はブラウザによって異なる。Chromeのmap処理が遅すぎる点に注意。
デバッグツールのコンソールからの実行だと遅いのは本当だった。前回のEdgeは遅すぎた。それでも他のブラウザと比較する(ry
ベンチマーク測定
実行環境
Win1 (Desktop) | Win2 (Laptop) | Mac (MacBook Air) | |
---|---|---|---|
OS | Win10 x64 (1809) | Win10 x64 (1809) | macOS 10.13.6 |
CPU | Core i7 7770 @3.60GHz | Core i5 8265U @1.60GHz | Core i5 4260U @1.40GHz |
Mem | 16GB | 8GB | 8GB |
Chrome | 74.0.3729.131 | 74.0.3729.131 | 74.0.3729.131 |
Firefox | 66.0.5 | 66.0.5 | 66.0.5 |
Edge | 18.17763 | 18.17763 | - |
Safari | - | - | 12.1.0 |
※ ブラウザは全て64ビット
※ 全てCPUはターボブーストONのため、CPUクロックなんてあてにならない
実行内容
元記事を踏襲し、次の5つに方法について、1千万回ループで足し算を行う時間を測定する。それぞれについて10回測定し、結果が良い方から5回の平均値を算出する。
- for
- for-of
- Array#forEach
- Array#map
- Array#reduce
また実行方法として次の3種類で計測する。
type | description |
---|---|
global | 演算対象の変数をグローバル(window)スコープに置いて測定する。 |
global-scoped | グローバル(window)スコープで実行するが、演算対象の変数は各ループのスコープ内部に置いて測定する。 |
scoped | スコープを全てグローバルと分けて実行し、測定する。 |
ソースはこちら
実行方法はHTTPSがサポートされたサーバーに実行スクリプトを読み込むHTMLファイルを配置し、ブラウザでそのHTMLファイルを読み込むこととする。ここから実行できる。
(コンソールからの実行だと結果が違う可能性があるという噂があるので)
実行結果
OS | Browser | mode | for | for-of | forEach | map | reduce |
---|---|---|---|---|---|---|---|
Win1 | Chrome | global | 124 | 125 | 206 | 2080 | 120 |
Win1 | Chrome | global-scoped | 11 | 11 | 203 | 2053 | 119 |
Win1 | Chrome | scoped | 11 | 11 | 202 | 2048 | 118 |
Win1 | Firefox | global | 22 | 119 | 23 | 144 | 19 |
Win1 | Firefox | global-scoped | 12 | 106 | 25 | 150 | 19 |
Win1 | Firefox | scoped | 12 | 103 | 25 | 148 | 19 |
Win1 | Edge | global | 97 | 318 | 240 | 381 | 386 |
Win1 | Edge | global-scoped | 91 | 280 | 248 | 396 | 372 |
Win1 | Edge | scoped | 76 | 283 | 241 | 379 | 372 |
Win2 | Chrome | global | 107 | 105 | 200 | 2394 | 132 |
Win2 | Chrome | global-scoped | 12 | 12 | 201 | 2423 | 131 |
Win2 | Chrome | scoped | 12 | 14 | 205 | 2435 | 130 |
Win2 | Firefox | global | 29 | 137 | 28 | 181 | 24 |
Win2 | Firefox | global-scoped | 15 | 118 | 29 | 178 | 23 |
Win2 | Firefox | scoped | 15 | 124 | 30 | 180 | 23 |
Win2 | Edge | global | 104 | 373 | 244 | 395 | 334 |
Win2 | Edge | global-scoped | 139 | 303 | 245 | 401 | 319 |
Win2 | Edge | scoped | 75 | 340 | 245 | 401 | 328 |
Mac | Chrome | global | 256 | 255 | 385 | 12480 | 183 |
Mac | Chrome | global-scoped | 13 | 18 | 386 | 12584 | 189 |
Mac | Chrome | scoped | 14 | 18 | 392 | 12542 | 183 |
Mac | Firefox | global | 40 | 228 | 42 | 227 | 26 |
Mac | Firefox | global-scoped | 27 | 215 | 36 | 224 | 26 |
Mac | Firefox | scoped | 22 | 193 | 35 | 223 | 26 |
Mac | Safari | global | 47 | 265 | 46 | 62 | 15 |
Mac | Safari | global-scoped | 14 | 243 | 46 | 60 | 15 |
Mac | Safari | scoped | 13 | 646 | 46 | 60 | 15 |
(単位:ミリ秒。小数点以下は四捨五入。)