本文へ移動

§09-27Forms

Optimistic submit

サーバーの応答を待たずに送信結果を画面に出す。

送信した内容を即座に画面に反映し、待ち時間を感じさせない。コメント投稿やチェックの切り替えなど、失敗が少なく小さな操作に向く。

実装のポイント

楽観更新は送信前に仮 ID で表示し、失敗時のロールバックと再送の導線を先に設計する。成功時はサーバーの ID で仮 ID を置き換える。

特徴
  • 楽観的更新
  • 非同期
デモで使っているもの
  • shadcn/ui
  • lucide-react

このパターンが効く目的