Persistent Storage di Mobile

Mobile app butuh menyimpan data lokal — user preferences, cached data, auth tokens. Tidak ada localStorage seperti di browser, tapi ada beberapa alternatif yang lebih powerful.

AsyncStorage — Simple Key-Value

import AsyncStorage from '@react-native-async-storage/async-storage';

// Simpan data
await AsyncStorage.setItem('user_name', 'Budi');
await AsyncStorage.setItem('settings', JSON.stringify({
  darkMode: true,
  language: 'id',
}));

// Baca data
const name = await AsyncStorage.getItem('user_name');
const settings = JSON.parse(await AsyncStorage.getItem('settings'));

// Hapus
await AsyncStorage.removeItem('user_name');

// Multi-operations (batch, lebih efisien)
await AsyncStorage.multiSet([
  ['key1', 'value1'],
  ['key2', 'value2'],
]);
const results = await AsyncStorage.multiGet(['key1', 'key2']);

MMKV — High Performance Storage

import { MMKV } from 'react-native-mmkv';

const storage = new MMKV();

// Synchronous! (beda dari AsyncStorage yang async)
storage.set('user.name', 'Budi');
storage.set('user.age', 25);
storage.set('user.premium', true);

const name = storage.getString('user.name');    // 'Budi'
const age = storage.getNumber('user.age');       // 25
const isPremium = storage.getBoolean('user.premium'); // true

// Delete
storage.delete('user.name');
storage.clearAll();

Expo SecureStore — Untuk Data Sensitif

import * as SecureStore from 'expo-secure-store';

// Auth token HARUS di SecureStore, bukan AsyncStorage
await SecureStore.setItemAsync('auth_token', 'eyJhbGci...');
const token = await SecureStore.getItemAsync('auth_token');
await SecureStore.deleteItemAsync('auth_token');

// SecureStore menggunakan:
// iOS: Keychain Services (encrypted)
// Android: SharedPreferences + Android Keystore

Perbandingan Storage Options

• AsyncStorage — Mudah, async, unencrypted, lambat untuk data besar. Cocok untuk preferences sederhana.
• MMKV — Synchronous, 30x lebih cepat dari AsyncStorage. Cocok untuk state persistence, cache.
• SecureStore — Encrypted, untuk auth token, API keys, sensitive data. Limit ~2KB per item.
• SQLite (expo-sqlite) — Database relasional lokal. Cocok untuk offline-first app dengan query kompleks.
• WatermelonDB — ORM di atas SQLite, lazy loading, sync support.

Zustand + MMKV Persistence

import { create } from 'zustand';
import { persist, createJSONStorage } from 'zustand/middleware';
import { MMKV } from 'react-native-mmkv';

const storage = new MMKV();

const mmkvStorage = {
  getItem: (name) => storage.getString(name) ?? null,
  setItem: (name, value) => storage.set(name, value),
  removeItem: (name) => storage.delete(name),
};

const useSettingsStore = create(
  persist(
    (set) => ({
      theme: 'light',
      setTheme: (theme) => set({ theme }),
    }),
    {
      name: 'settings-storage',
      storage: createJSONStorage(() => mmkvStorage),
    }
  )
);