React RouterとNext.js@16のビルド速度と比較する

publication: 2025/10/23

update:2025/10/23

Next.js@16 の登場

2025/10/21 にNext.js 16がリリースされました。ビルド速度が向上したとのことなので早速確認してみます。

マークダウンエディタの作り方を解説する記事で使っていた、ほぼ同じ動作をするコードをNext.js用とReact Router用で利用しています。

手元の環境でビルドさせてみた結果

Next.js は React Router のビルドと同じ条件になるようにignoreBuildErrors: trueを追加して、TypeCheck を省いています。

フレームワーク	バージョン	バンドラ	速度
Next.js	16.0.0	turbopack	6.61s
Next.js	16.0.0	webpack	19.66s
Next.js	15.5.3	turbopack	12.88s
Next.js	15.5.3	webpack	16.72s
React Router	7.8.2	rolldown-vite(NativePlugin)	3.03s
React Router	7.8.2	rolldown-vite	4.16s
React Router	7.8.2	vite	5.19s

{"width":"391px","height":"314px"}

{"width":"597px","height":"380px"}

Next.js が React Router のビルド速度にだいぶ近づいてきました。ただ、webpack を指定すると以前より遅くなるという謎の挙動なので、互換性重視で Next.js を webpack で使用する場合は気をつけてください。