bind とラップ関数の速度比較
- カテゴリ:
- JavaScript
- コメント数:
- Comments: 0
◆ bind のほうが 5 倍くらい早かった (Chrome 69)
関数の一部を部分適用したいとき bind にするかラップする関数を作るか迷います
アロー関数ができてからは そこまで書くのが面倒でもないし引数の場所を自由に設定できるメリットがあります
bind は前からしか引数を事前に設定できない上に this を毎回指定しないと行けないのが面倒です
アロー関数がメインになってくると this は使わないことも多いので毎回 null 書くのも面倒です
そうなるととりあえずアロー関数でいいかなと思います
パフォーマンス的にはどっちがいいんだろうと思って比較してみました
それぞれ 100 万回実行した結果は
bind のほうが 5 倍ほど早いです
bind でも結局新しい関数作ってるから大差なさそうに思いましたが 最適化とかがうまく使われてるのでしょう たぶん
5 倍も差があると言っても 遅い方でも 100 万回で 0.03 秒で終わるようなものなので普通は気にしなくていいと思います
const fn = (a, b) => console.log(a * b)
const ex_bind = fn.bind(null, 1)
const ex_arrow = b => fn(1, b)
アロー関数ができてからは そこまで書くのが面倒でもないし引数の場所を自由に設定できるメリットがあります
bind は前からしか引数を事前に設定できない上に this を毎回指定しないと行けないのが面倒です
アロー関数がメインになってくると this は使わないことも多いので毎回 null 書くのも面倒です
そうなるととりあえずアロー関数でいいかなと思います
パフォーマンス的にはどっちがいいんだろうと思って比較してみました
<!doctype html>
<script>
function add(a, b) {
return a + b
}
const fn1 = add.bind(null, 100)
const fn2 = b => add(100, b)
console.assert(fn1(1), fn2(1))
const measure = (fn, num) => {
console.time(fn.name)
for (let i = 0; i < num; i++) {
fn()
}
console.timeEnd(fn.name)
}
measure(fn1, 1000000)
measure(fn2, 1000000)
</script>
それぞれ 100 万回実行した結果は
bound add: 5ms
fn2: 28.999755859375ms
bind のほうが 5 倍ほど早いです
bind でも結局新しい関数作ってるから大差なさそうに思いましたが 最適化とかがうまく使われてるのでしょう たぶん
5 倍も差があると言っても 遅い方でも 100 万回で 0.03 秒で終わるようなものなので普通は気にしなくていいと思います