高速化の観点から new Array(100) を使わない方が良い理由

別件で V8 の JIT コードの逆アセンブルを眺めている時に気づいたのですが、JavaScriptで new Array(100) という形で配列を作るのは、高速化の観点から言うと V8 においては避けるべき書き方です。 高速化を求める方は、 new Array() や [] で作成して Array#push で追加していくのが良いでしょう。この記事では、その理由を説明します。 今回の記事は、以下の V8 のブログ記事を参考にしております。 https://v8.dev/blog/elements-kinds 「詰まった配列(Packed Array)」と「穴あき配列(Holey Array)」 v8 は内部的に、その配列がどういうタイプの配列であるかの状態を記録しており、その情報を利用して最適化を適用します。状態は内部的には21個あるのですが、今回話題にするのは、その中でも「詰まってい

[fa11enprince]

うーん。JavaScriptにぶっちゃけ速度なんて求めてない。変なハックやられるほうが困る

[chimerast]

C++やJavaあたりの、配列リストの要素追加時のメモリ再配置について知っているとやりがちかも。最近はCPU速いし実装も賢くなってるからやらないな。あとよほど高頻度でアクセスしない限り17%の速度劣化は無視していい。

[fn7]

バージョンアップで改善されて意味のないコーディングスタイルが残るということになりそうだからやらないけど、面白い内容でした。

[yasu-log]

イミュータブル思考や関数型など、GC起きまくり富豪プログラミングをしているプログラマには、速度の大事さやこの記事のありがたみがわからないのでは

[infobloga]

話としては興味深いだけど、17%は誤差範囲だよな。非ネイティブなPromiseやasync-awaitのオーバヘッドとか比べ物にならないほど重いけど、普通にみんな使ってるしね。

[t_f_m]

2019年6月の記事

[axljpn]

みんな new Array() ってやってるのか…というのが一番の衝撃。JSではx = []が普通だと思ってた。

[mysticatea]

array.fill(0) したら戻らないかな？

[efcl]

V8は疎の配列は最適化しないという話。一度でもsparseなarrayになると、fast pathから落ちてしまう

[ginpei]

empty slotsを持つHoley Array状態だと要素アクセスがV8で17%遅くなるという計測結果。また一度なるとそうでないPacked状態には戻せない。実際この差を気にする程の実装することはないだろうけど、こういうのたのしい。

[you21979]

推測するな計測せよ案件。でも正直こまる。typedarray使うしかないかな

[iwadon]

確認用ページの各ブラウザの結果を見たら、Chrome以外はそこまで差がないかむしろHoleyの方が早い場合があるようで興味深い。

[uzimith]

こういう最適化によるコード書くとエンジンが進化していらなくなったあと読むと謎になるから思うがままに書いたほうがよさそう

[mayumayu_nimolove]

airbnbの方式でやれって言ってる

[rryu]

むしろ「new Array(100)」はPacked Arrayが保証されそうな気がするのにHoley Arrayになるのはどういう利用想定なのだろう。

[lorenz_sys]

js やる人で配列の実装を意識する人ってどのくらいいるんだろう？ まぁアプリの仕事やってるとよっぽどの問題がない限り言語実装レベルに思いをはせることは忘れがちになってしまうんだよなぁ。言語に関係なく。

[kathew]

new Array(100)するくらいなら100回push()せよということらしい。このくらいならちょっと意識してれば良いので問題ないかな／他言語でありふれている書き方がNoとされるのは微妙だけど

[amedama41]

そもそもなんで穴あき配列なんて仕様を入れたのか。メリットよりも、バグの要因になるデメリットの方が大きそう

[diveintounlimit]

17%はまぁ、誤差の範囲内って感じするなぁ(´・ω・｀)エンジンの実装に寄せてチューニングするのはあんまりいい感じしない。

[tick2tack]

最適化は最適化の必要性が出たときにのみ行うべきとしたうえで、こういう話を知るのは楽しい

[kabochatori]

ほぼ使われることのないArrayコンストラクタはやっぱり使う必要がなかった

[annoy]

モダンな言語で実装とかの細部は抽象化されたプログラミングをしていたはずなのに本末転倒だよなあ。

[og24715]

range = r => [...new Array(r).keys()]

[monorod]

JavaScriptは割と速度求める気がするけど…、でもこういう系の実行速度はブラウザによってまちまちだから最適化しづらくて、結局あまり考えない方が良いのはある。トランスパイラとか使ってればもうわからんしな

[Helfard]

興味深い。この仕様は合理的ではあると思うけど、そのうち定期的に再検証するようにはならないのかな？

[yulalila]

資料的なテーブル作るときによくやってた。気をつけよ。

[odakaho]

“new Array(0) で長さゼロの配列を作っても、なぜか穴あき配列（Holey Array）扱いされてしまうようです。もちろん new Array(1, 2, 3) のように初期化すると、詰まった配列（Packed Array）扱いされる”

[madooka]

速度差については追試してみたいが、とりあえず面白い / 以前（いつ）はキー n に値を入れただけで n+1 要素確保されていたような

[otherworld]

個人的にはここ20年ぐらいでnew Array(100)を必要とする機会がなかったかも。

[kazuau]

new Array(100)と[...new Array(100)]が違うものになってパフォーマンスも違うということなら、エンジンの最適化がまだ不十分なのではないだろうか