Implementing Data Sync & Conflict Resolution Offline in Flutter

Introduction

In mobile development, ensuring data consistency across offline and online states is crucial. Flutter’s reactive UI makes it easy to build the front end, but syncing local changes with a backend while handling conflicts requires a strategic approach. Offline-first apps must queue user edits, detect network availability, reconcile divergent versions, and minimize data loss. This tutorial covers selecting a local storage strategy, detecting connectivity, implementing robust sync workflows, resolving conflicts, and applying best practices. By the end, you’ll have a clear path to implement a resilient data synchronization layer in your Flutter application.

Choosing a Local Storage & Change Queue

Offline edits need durable storage and a way to mark pending operations. Popular options include Hive for key-value simplicity or sqflite for relational models. Store a pendingSync flag or maintain a separate queue table to track inserts, updates, and deletes. This helps isolate local changes from server data.

Example: caching a note object in Hive and flagging it for sync:

class Note {
  String id;
  String text;
  bool pendingSync;

  Note({required this.id, required this.text, this.pendingSync = true});
}

Future<void> saveNote(Note note) async {
  final box = await Hive.openBox<Note>('notes');
  note.pendingSync = true;
  await box.put(note.id, note);
}

Queue entries should include operation type and timestamp for ordering. This local store becomes the source of truth when offline and the change log when online.

Detecting Connectivity & Performing Sync

Use the connectivity_plus plugin to listen for network changes. Upon regaining connectivity, process the queued operations in FIFO order to maintain causality. Wrap sync logic in a service that:

• Reads all pending items.

• Sends batched requests to your API.

• Marks items as synced on success.

• Retries or logs errors on failure.

Example snippet for connectivity-driven sync:

Connectivity().onConnectivityChanged.listen((status) async {
  if (status != ConnectivityResult.none) {
    final queue = await getPendingOperations();
    for (var op in queue) {
      final res = await apiClient.syncOperation(op);
      if (res.success) await markAsSynced(op.id);
    }
  }
});

Use exponential backoff for retries and handle HTTP 409 responses for conflicts (described next).

Implementing Conflict Resolution

Concurrent edits—when a user modifies the same record on multiple devices—lead to version divergence. Common strategies include Last-Write-Wins (LWW) or custom merge logic. LWW uses timestamps: the most recent change prevails, discarding older edits. Custom merges inspect fields, combining non-overlapping updates.

Example merge function for a simple record:

Map<String, dynamic> mergeRecord(
    Map<String, dynamic> local, Map<String, dynamic> remote) {
  return {
    'id': local['id'],
    'text': local['editedAt'] > remote['editedAt']
        ? local['text']
        : remote['text'],
    'editedAt':
        max(local['editedAt'] as int, remote['editedAt'] as int),
  };
}

When the server detects a conflict, return both versions and apply merge logic client-side, or let the backend orchestrate merges and return a resolved copy. Always store the merged result locally and update the remote version to keep both sides in sync.

Best Practices & Optimization

1. Delta Sync: Exchange only changed fields or records since last timestamp to reduce payloads.

2. Background Sync: Use workmanager or flutter_background to schedule periodic uploads even when the app is not active.

3. Batch Size: Tune your batch limits to avoid hitting API rate limits or memory issues.

4. Error Handling: Differentiate between transient network errors (retryable) and data errors (skip or alert the user).

5. State Management: Expose sync status via providers or Bloc so your UI reflects “syncing,” “up to date,” or “sync failed” states.

By combining these techniques, you deliver a seamless offline experience and robust data integrity under all network conditions.

Vibe Studio

Vibe Studio, powered by Steve’s advanced AI agents, is a revolutionary no-code, conversational platform that empowers users to quickly and efficiently create full-stack Flutter applications integrated seamlessly with Firebase backend services. Ideal for solo founders, startups, and agile engineering teams, Vibe Studio allows users to visually manage and deploy Flutter apps, greatly accelerating the development process. The intuitive conversational interface simplifies complex development tasks, making app creation accessible even for non-coders.

Conclusion

Implementing offline data sync and conflict resolution in Flutter involves choosing the right local storage, queuing offline operations, detecting connectivity, and applying deterministic merge strategies. Leveraging connectivity_plus, a change queue, and conflict-resolution patterns like LWW or custom merges ensures consistent data across devices. Optimize with delta sync, background tasks, and clear UI indicators. By following these steps, your Flutter app will gracefully handle offline usage, synchronize reliably, and preserve user data integrity under concurrent edits.