今回は最適化の効果等について検証します。
世の中にはコードが短ければ速くなると思っている人がいますがJavaScriptはJITコンパイラが使われていることがほとんどなので計算段階での計算速度への影響はありません。
TL;DR
- 速度重視ならアロー関数は使うな
- for文で配列の長さを使うなら変数に保存しろ
- さほど大きくない数字の配列を扱うならUint8ArrayやInt16Array等を使え、ただし範囲はよく調べろ
- thisやクラスはスコープ内変数より遅い
計測方法
const checkcount = 10000;
const check = (n,fn) => {
const c = () => {
const start = performance.now();
fn();
const end = performance.now();
return end - start;
}
const res = [];
for(let i = 0;i < checkcount;i++)
res.push(c())
console.log(n+":"+res.reduce((p,c)=>p+=c)/checkcount)
}
performance.now()で時間を取得して1万回行った平均を求めます。
環境
Intel(R) Core(TM) -5-7200U CPU @ 2.50GHz
Intel(R) HD Graphics 620
Microsoft Windows Pro 10 バージョン22H2 OSビルド19045.5247
nodejs v20.12.2
bun 1.1.38
Visual studio code
powershell
YouTubeとか見ながらしてたので多少左右します
1.匿名関数(noop)
内容のない関数二つの速度を比較します。
check("arrow noop",()=>{})
check("funct noop",function(){})
予想
thisの余計な計算がないからアロー関数の方が速そう
結果
arrow noop:0.0005066499999999692
funct noop:0.0001306200000000061
通常の関数の方が速かった...
考察
アロー関数はスコープをたどらないといけないため遅くなった？
BigIntでループ
bigintとnumberで1万回ループします
check("number loop",()=>{
for(let i = 0; i < 10000;i++);
})
check("bigint loop",()=>{
for(let i = 0n;i < 10000n;i++);
})
予想
numberと違ってBigIntは小数点がないから速そう
結果
number loop:0.006236490000000312
bigint loop:0.4420627400000003
BigIntのボロ負け
考察
BigIntはJIT内でループの最適化がされなかった？
それかBigIntが普通に遅い
配列の長さのキャッシュ
長さを保存してからループします
check("len cached",()=>{
const arr = new Array(10000);
const len = arr.length
for(let i = 0;i < len;i++);
})
check("len nocache",()=>{
const arr = new Array(10000);
for(let i = 0;i < arr.length;i++);
})
予想
どっかのサイトにこれで速くなるとあったし理屈が通ってるので速くなるね、言うまでもない。
結果
len cached:0.00830133999999707
len nocache:0.022141320000002726
速い！
考察
普通にlengthのゲッター処理があるから時間がかかる？
evalを使う
evalと通常表記で1万回のループをします
check("eval",()=>{
eval("for(let Z=0;Z<10000;Z++);")
})
check("native",()=>{
for(let i=0;i<10000;i++);
})
予想
evalごとにJITコンパイラかインタプリタが動くのでevalは遅いね、言うまでもない。
結果
eval:0.007514940000000057
native:0.004491899999999981
evalの方がちょっと遅い
考察
処理の使いまわしをしている？
var vs. let
var宣言とlet宣言で10万回ループします
check("var",()=>{
for(var i=0;i<100000;i++);
})
check("let",()=>{
for(let i=0;i<100000;i++);
})
予想
印象的にvarが遅そう
結果
var:0.0510033400000004
let:0.03656134999999887
何回か計測したけどletの方が遅いこともあった
考察
宣言方法に大差無し！
Uint8ArrayとArrayで10万回の代入
Uint8ArrayとArrayに1を代入します
check("uint8loop",()=>{
const arr = new Uint8Array(100000);
for(let i = 0;i < arr.length;i++) arr[i] = 1;
})
check("arrayloop",()=>{
const arr = new Array(100000);
for(let i = 0;i < arr.length;i++) arr[i] = 1;
})
予想
Uint8Arrayの方が機械に近くて速そう
結果
uint8loop:0.2944365700000023
arrayloop:0.8646147300000013
目に見えてUint8Arrayが速い！
考察
Uint8Arrayは型が確定しているか、機械に近いか。
三項演算子
三項演算子とIF文どちらが速いか
check("?:",()=>{
const arr = [];
for(let i = 0;i < 10000;i++) i % 2 ? arr.push(5) : arr.push(2);
})
check("if",()=>{
const arr = [];
for(let i = 0;i < 10000;i++)
if(i % 2) arr.push(5)
else arr.push(2)
})
予想
三項演算子の方が速そう
結果
?::0.056880590000000064
if:0.05327013000000045
微々たる差だがif文の方が速い！
考察
if文の方が機械に近い？
スコープとthis
スコープ内の変数によるループとクラス内のループで比較します。
ついでにプライベート変数も比較します。
check("scope",()=>{
function loopFactory(){
let i = 0;
return function(){
for(i = 0;i < 10000;i++);
}
}
const loop = loopFactory();
loop();
})
check("class",()=>{
class Loop{
i;
constructor(){
this.i = 0;
}
loop(){
for(this.i = 0;this.i < 10000;this.i++);
}
}
const loop = new Loop();
loop.loop();
})
check("classP",()=>{
class Loop{
#i;
constructor(){
this.#i = 0;
}
loop(){
for(this.#i = 0;this.#i < 10000;this.#i++);
}
}
const loop = new Loop();
loop.loop();
})
考察
thisを介さないといけないからクラスは遅いけどプライベート変数は外部に表示しないから比較的速い？
結果
scope:0.036733379999999934
class:0.2731350399999993
classP:0.45610956999999763
圧倒的スコープ
考察
thisを介すのはやっぱり遅いよね...
プライベート変数は特別な処理をするのかな？
node vs. bun
nodeとbun、どちらが速いかこれでもう一度確かめます。以下はここのすべてのコード比較コードです
const checkcount = 10000;
const check = (n,fn) => {
const c = () => {
const start = performance.now();
fn();
const end = performance.now();
return end - start;
}
const res = [];
for(let i = 0;i < checkcount;i++)
res.push(c())
console.log(n+":"+res.reduce((p,c)=>p+=c)/checkcount)
}
check("arrow noop",()=>{})
check("funct noop",function(){})
console.log("")
check("number loop",()=>{
for(let i = 0; i < 10000;i++);
})
check("bigint loop",()=>{
for(let i = 0n;i < 10000n;i++);
})
console.log("")
check("len cached",()=>{
const arr = new Array(10000);
const len = arr.length
for(let i = 0;i < len;i++);
})
check("len nocache",()=>{
const arr = new Array(10000);
for(let i = 0;i < arr.length;i++);
})
console.log("")
check("eval",()=>{
eval("for(let Z=0;Z<10000;Z++);")
})
check("native",()=>{
for(let i=0;i<10000;i++);
})
console.log("")
check("var",()=>{
for(var i=0;i<100000;i++);
})
check("let",()=>{
for(let i=0;i<100000;i++);
})
console.log("")
check("uint8loop",()=>{
const arr = new Uint8Array(100000);
for(let i = 0;i < arr.length;i++) arr[i] = 1;
})
check("arrayloop",()=>{
const arr = new Array(100000);
for(let i = 0;i < arr.length;i++) arr[i] = 1;
})
console.log("")
check("?:",()=>{
const arr = [];
for(let i = 0;i < 10000;i++) i % 2 ? arr.push(5) : arr.push(2);
})
check("if",()=>{
const arr = [];
for(let i = 0;i < 10000;i++)
if(i % 2) arr.push(5)
else arr.push(2)
})
結果
頑張ってテーブル化しました。きつい。
| タイトル | nodejs | bun |
|---|---|---|
| arrow noop | 0.0002971100000000263 | 0.00023385000000004084 |
| funct noop | 0.00017492000000002435 | 0.00007084999999999298 |
| number loop | 0.005526530000000038 | 0.011351059999999987 |
| bigint loop | 0.4051602199999979 | 0.7218548800000042 |
| len cached | 0.007827849999996852 | 0.06264597000000012 |
| len nocache | 0.013203849999999875 | 0.057115710000000125 |
| eval | 0.004763229999995383 | 0.022002820000001703 |
| native | 0.004406499999999687 | 0.013971630000003097 |
| var | 0.03667173999999968 | 0.11217761000001501 |
| let | 0.037452690000006714 | 0.11275581000001311 |
| uint8loop | 0.2656331500000025 | 0.17104559999998656 |
| arrayloop | 0.8199938500000077 | 0.45781148000002103 |
| ?: | 0.05362607000000017 | 0.10521647000000026 |
| if | 0.052280720000000044 | 0.07787996000000007 |
| scope | 0.036733379999999934 | 0.02870950999999985 |
| class | 0.2731350399999993 | 0.019864589999999804 |
| classP | 0.45610956999999763 | 1.3481609800000118 |
やっぱりbunは速い！と思ったけど所々遅い部分も。
集計ミスもあるかもだけどV8製nodejsとwebkit製bunだと最適化方法が違うのかな？