local-first

Use a local-first sync engine such as PowerSync, ElectricSQL, or Replicache instead of React Query. The UI reads and writes a local database like SQLite WASM, and a background worker syncs changes to the server when connectivity returns.

React Query and SWR are HTTP caching layers that fail offline and add network latency. Local-first engines like PowerSync query a local SQLite database directly, resolving instantly and syncing silently in the background.

CRDTs automatically merge concurrent edits without a central server picking a winner. Libraries like Yjs provide shared data types that observe local and remote changes and merge them cleanly when peers reconnect.

IndexedDB suits simple key-value storage and is best accessed via Dexie.js for a clean Promise API. SQLite WASM with OPFS gives you true relational SQL in the browser but requires more setup complexity.

localStorage is synchronous, blocks the main thread, and caps out around 5MB. For structured data beyond that limit, use IndexedDB via Dexie or SQLite WASM, which support larger datasets and indexed queries.

Local-first adds complexity in conflict resolution and sync design, so simple server-rendered apps with no offline requirement may not benefit. It fits best when offline support, multi-device sync, or real-time collaboration are core requirements.