JavaScript: 配列複製の速度比較

spread構文とArray系関数の複製速度の比較をしてみます。


# benchmark 1
```js:配列1匹分
for(let loop=1<<20,size=2,n=10;n--;loop/=2,size*=2){
	let A=Array(size).fill(1),t=new Date;
	for(let a=loop,b;a--;)b=[...A];
	t=new Date-t;
	let u=new Date;
	for(let a=loop,b;a--;)b=A.concat();
	let v=new Date;
	for(let a=loop,b;a--;)b=A.slice();
	let w=new Date;
	for(let a=loop,b;a--;)b=Array.from(A);
	console.log("loop:",loop,"size:",size,"time:",t,new Date-u,new Date-v,new Date-w)
}
```
## Chrome(128.0.6613.113)
<table>
<tr><th>loop<th>size<th>spread<th>concat<th>slice<th>from
<tr><td>1048576<td>2<td>392<td>659<td>616<td>585
<tr><td>524288<td>4<td>276<td>380<td>359<td>345
<tr><td>262144<td>8<td>217<td>259<td>249<td>241
<tr><td>131072<td>16<td>186<td>188<td>182<td>176
<tr><td>65536<td>32<td>177<td>159<td>155<td>152
<tr><td>32768<td>64<td>171<td>145<td>142<td>140
<tr><td>16384<td>128<td>166<td>134<td>132<td>130
<tr><td>8192<td>256<td>168<td>130<td>128<td>126
<tr><td>4096<td>512<td>163<td>129<td>127<td>125
<tr><td>2048<td>1024<td>165<td>132<td>130<td>128
</table>

loop数固定、配列長巨大化
<table>
<tr><th>loop<th>size<th>spread<th>concat<th>slice<th>from
<tr><td>2048<td>2<td>0<td>3<td>2<td>2
<tr><td>2048<td>6<td>1<td>4<td>3<td>3
<tr><td>2048<td>18<td>4<td>5<td>4<td>4
<tr><td>2048<td>54<td>10<td>9<td>8<td>8
<tr><td>2048<td>162<td>27<td>28<td>28<td>27
<tr><td>2048<td>486<td>79<td>63<td>62<td>61
<tr><td>2048<td>1458<td>254<td>189<td>187<td>184
<tr><td>2048<td>4374<td>687<td>532<td>524<td>516
<tr><td>2048<td>13122<td>1971<td>1574<td>1553<td>1533
<tr><td>2048<td>39366<td>6540<td>5998<td>5634<td>5269
</table>

## Firefox(97.0.1)
<table>
<tr><th>loop<th>size<th>spread<th>concat<th>slice<th>from
<tr><td>1048576<td>2<td>116<td>595<td>422<td>338
<tr><td>524288<td>4<td>100<td>342<td>240<td>197
<tr><td>262144<td>8<td>97<td>292<td>187<td>150
<tr><td>131072<td>16<td>111<td>197<td>124<td>107
<tr><td>65536<td>32<td>72<td>161<td>97<td>89
<tr><td>32768<td>64<td>73<td>128<td>80<td>75
<tr><td>16384<td>128<td>105<td>237<td>154<td>114
<tr><td>8192<td>256<td>151<td>371<td>246<td>158
<tr><td>4096<td>512<td>133<td>298<td>196<td>134
<tr><td>2048<td>1024<td>117<td>239<td>148<td>109
</table>

loop数固定、配列長巨大化
<table>
<tr><th>loop<th>size<th>spread<th>concat<th>slice<th>from
<tr><td>2048<td>2<td>3<td>2<td>1<td>1
<tr><td>2048<td>6<td>4<td>1<td>2<td>2
<tr><td>2048<td>18<td>2<td>4<td>2<td>2
<tr><td>2048<td>54<td>4<td>7<td>5<td>4
<tr><td>2048<td>162<td>13<td>26<td>18<td>15
<tr><td>2048<td>486<td>51<td>102<td>73<td>59
<tr><td>2048<td>1458<td>188<td>292<td>219<td>153
<tr><td>2048<td>4374<td>410<td>869<td>550<td>411
<tr><td>2048<td>13122<td>1258<td>2572<td>1577<td>1278
<tr><td>2048<td>39366<td>4169<td>8879<td>5419<td>4264
</table>

# benchmark 2
```js:配列2匹分
for(let loop=1<<20,size=2,n=10;n--;loop/=2,size*=2){
	let A=Array(size).fill(1),t=new Date;
	for(let a=loop,b;a--;)b=[...A,...A];
	t=new Date-t;
	let u=new Date;
	for(let a=loop,b;a--;)b=A.concat(A.concat());
	console.log("loop:",loop,"size:",size,"time:",t,new Date-u)
}
```
## Chrome
<table>
<tr><th>loop<th>size<th>spread<th>concat
<tr><td>1048576<td>2<td>487<td>378
<tr><td>524288<td>4<td>320<td>188
<tr><td>262144<td>8<td>245<td>97
<tr><td>131072<td>16<td>206<td>54
<tr><td>65536<td>32<td>198<td>29
<tr><td>32768<td>64<td>202<td>16
<tr><td>16384<td>128<td>197<td>12
<tr><td>8192<td>256<td>194<td>8
<tr><td>4096<td>512<td>191<td>8
<tr><td>2048<td>1024<td>189<td>7
</table>

loop数固定、配列長巨大化
<table>
<tr><th>loop<th>size<th>spread<th>concat
<tr><td>2048<td>2<td>3<td>1
<tr><td>2048<td>6<td>4<td>1
<tr><td>2048<td>18<td>10<td>1
<tr><td>2048<td>54<td>17<td>1
<tr><td>2048<td>162<td>32<td>2
<tr><td>2048<td>486<td>97<td>4
<tr><td>2048<td>1458<td>269<td>11
<tr><td>2048<td>4374<td>780<td>30
<tr><td>2048<td>13122<td>2281<td>92
<tr><td>2048<td>39366<td>8472<td>1110
</table>

## Firefox
<table>
<tr><th>loop<th>size<th>spread<th>concat
<tr><td>1048576<td>2<td>217<td>386
<tr><td>524288<td>4<td>206<td>279
<tr><td>262144<td>8<td>197<td>228
<tr><td>131072<td>16<td>162<td>193
<tr><td>65536<td>32<td>169<td>168
<tr><td>32768<td>64<td>223<td>203
<tr><td>16384<td>128<td>301<td>317
<tr><td>8192<td>256<td>259<td>343
<tr><td>4096<td>512<td>227<td>292
<tr><td>2048<td>1024<td>212<td>251
</table>

loop数固定、配列長巨大化
<table>
<tr><th>loop<th>size<th>spread<th>concat
<tr><td>2048<td>2<td>5<td>4
<tr><td>2048<td>6<td>2<td>1
<tr><td>2048<td>18<td>3<td>5
<tr><td>2048<td>54<td>7<td>8
<tr><td>2048<td>162<td>28<td>59
<tr><td>2048<td>486<td>75<td>109
<tr><td>2048<td>1458<td>281<td>294
<tr><td>2048<td>4374<td>1064<td>1051
<tr><td>2048<td>13122<td>2508<td>2859
<tr><td>2048<td>39366<td>6715<td>8557
</table>

## 傾向考察
Chromeの場合、超小型の配列に対してはspread構文が断然優位。配列が巨大になってくるとspread構文が**若干**不利っぽい。
しかし複数の配列を連結させる場合は、配列の長短にかかわらずspread構文は非常に遅くなるっぽい。
Firefoxの場合、Chromeとは対照的な結果。