§15-12Perceived Performance
Offline indicator
ネット接続が切れたことをバナーで知らせる。
操作が反映されない原因が通信にあると気づかせる。移動中の利用や不安定な回線で、エラーの原因を誤解させない。
実装のポイント
navigator.onLine と online/offline イベントで状態を購読し、復帰時に短く知らせて消す。バナーは role=status で読み上げ、オフライン中の操作の扱いを明記する。
- 特徴
- ブラウザ API
- デモで使っているもの
- shadcn/ui
- lucide-react