- 依然としてReactは好きで、Vercelが提供するものも評価しているが、Next.jsの複雑さの増大とコストの問題により、TanStackへ移行
- TanStackはまだ不足している部分もあるが、直感的であり、必要なときに高度な機能を簡単に追加できる
- Next.jsの高度な機能が必要になるまでは、TanStackが最良の選択肢
Next.jsの強み
- 素早いセットアップと幅広い統合サポート
- Next.jsは「React Framework for the Web」として、Reactアプリを素早くセットアップできる
- さまざまな統合ガイドがある: MUI, MarkdocDataDog
- Jestのようなツール向けのネイティブプラグインを提供
- 高性能な大規模アプリケーションに有利
- 個々のページのレンダリングパターンを細かく調整できる
- 高性能のためのさまざまなAPIを提供
- サーバーサイドレンダリング(SSR)
- Partial Prerendering(PPR)
- エッジ関数、ストリーミング、選択的ハイドレーション
- Incremental Static Regeneration(ISR)のサポートにより、高トラフィックなコンテンツも効率的に処理できる
Next.jsの限界と問題点
- 不要な高度機能による複雑さ
- 高度な機能は小規模なアプリには過剰に感じられる
- 初期段階のスタートアップには不要なマイクロレベルの性能改善機能が多い
- 金銭的コストの問題
- Next.jsの多くの機能は商用サービスに結び付いている
- エッジコンピューティング (
middleware.ts)
- 画像変換 (
next/image)
- ISR (
export const revalidate = 60)
- サーバーレス関数の実行 (
app/api/route.ts)
- Vercelサービスへの依存度が高く、コスト増加のリスクがある
- 複雑な学習曲線と広いAPI表面
- App Routerの複雑さにより、学習曲線が急である
- ドキュメントの概念説明が難解で理解しにくい
- デバッグが難しい
- Full Route Cache、Data Cache、Router Cache という3つのキャッシュシステムが存在する
- SPA(シングルページアプリケーション)サポートの不足
- Next.jsのSPAサポートは限定的で、性能改善もしにくい
- Viteと比べて開発サーバーの性能が劣る
- TurboPackの性能も期待に及ばない
TanStack + Viteの利点
- シンプルで直感的な構造
- TanStack RouterはオートコンプリートとZodによる検索パラメータ検証を提供
- コードの流れが明確で予測しやすい
- TanStack Queryによる状態管理
- サーバー状態を簡単に管理でき、デバッグもしやすい
- 開発者ツールが組み込まれている
- Viteの高速な性能
- ビルドとコード実行の速度が速い
- 複雑な設定なしですぐに動作する
- 特定のクラウドサービスに依存しない
1件のコメント
作っていけば、結局は Next.js のようになると思います