Firestore Offline Data — Enabling Persistent Local Data for Mobile and Web Apps

// Enable offline persistence
import { initializeFirestore, CACHE_SIZE_UNLIMITED } from 'firebase/firestore';
import { getFirestore } from 'firebase/firestore';

// Enable with unlimited cache
const db = initializeFirestore(app, {
  cacheSizeBytes: CACHE_SIZE_UNLIMITED
});

// Or with specific cache size
const db2 = initializeFirestore(app, {
  cacheSizeBytes: 100 * 1024 * 1024  // 100 MB
});

// Enable for Web (indexedDB persistence)
import { enableMultiTabIndexedDbPersistence } from 'firebase/firestore';

enableMultiTabIndexedDbPersistence(db).catch((err) => {
  if (err.code === 'failed-precondition') {
    console.log('Multiple tabs open, persistence in single tab mode');
  } else if (err.code === 'unimplemented') {
    console.log('Browser does not support persistence');
  }
});

// Handling offline state
import { onSnapshot, doc } from 'firebase/firestore';

// Listen with metadata to detect cache vs server
const unsubscribe = onSnapshot(
  doc(db, 'users', 'user123'),
  { includeMetadataChanges: true },
  (snapshot) => {
    const source = snapshot.metadata.fromCache ? 'local cache' : 'server';
    const hasPending = snapshot.metadata.hasPendingWrites;
    console.log(`Data came from ${source}`);
    console.log(`Has pending writes: ${hasPending}`);

    if (snapshot.metadata.fromCache) {
      showOfflineIndicator(true);
    } else {
      showOfflineIndicator(false);
    }

    // Update UI
    updateUI(snapshot.data());
  }
);

// Detect online/offline
window.addEventListener('online', () => {
  console.log('Back online - syncing changes');
});

window.addEventListener('offline', () => {
  console.log('Offline - using cached data');
});

# Python Firestore offline persistence
from google.cloud import firestore

# Note: Python Admin SDK does not have offline persistence
# This is a client-side feature for web/mobile
# Use local caching strategies instead:

class LocalCache:
    def __init__(self):
        self.cache = {}

    def get_with_cache(self, doc_ref):
        doc_id = doc_ref.path
        if doc_id in self.cache:
            return self.cache[doc_id]
        doc = doc_ref.get()
        self.cache[doc_id] = doc.to_dict() if doc.exists else None
        return self.cache[doc_id]

// Write operations while offline
// These queue locally and sync when online
async function saveWhileOffline(userId, data) {
  const ref = doc(db, 'users', userId);
  await setDoc(ref, data);
  // Even if offline, this returns immediately
  // The write is queued locally
  console.log('Write queued for sync');
}

// Wait for pending writes to sync
import { waitForPendingWrites } from 'firebase/firestore';
await waitForPendingWrites(db);
console.log('All pending writes synced');