Lewati ke konten utama
menjadi.dev
Chapter 45.2 Mobile Lanjutan

MMKV: High-Performance Key-Value

Storage 30x lebih cepat dari AsyncStorage untuk mobile

Tujuan Pembelajaran

  • Memahami keunggulan MMKV dibanding AsyncStorage
  • Mampu menginstal dan menggunakan react-native-mmkv
  • Mengerti use case yang tepat untuk MMKV vs AsyncStorage

Analogi

Diagram

      AsyncStorage vs MMKV:
AsyncStorage = Baca buku dari perpustakaan (lambat, async, overhead)
MMKV = Baca dari RAM (instant, sync, zero-overhead)

MMKV pakai memory-mapped file — perubahan langsung ke memory, OS yang handle sync ke disk.
    

MMKV seperti RAM — super cepat karena pakai memory-mapped file. AsyncStorage seperti baca dari disk — lebih lambat tapi lebih compatible.

Penjelasan Konsep

MMKV adalah library key-value storage yang dikembangkan Tencent untuk WeChat. 30x lebih cepat dari AsyncStorage karena menggunakan memory-mapped file dan native C++ implementation (bukan JavaScript bridge).

Keunggulan MMKV: (1) Synchronous — storage.getString(key) langsung return value, tidak perlu await. (2) Type support — getBoolean, getNumber, getString. (3) Encryption support built-in. (4) Multi-instance — bisa buat beberapa MMKV instance terpisah. (5) Cross-platform: iOS, Android, Web.

Setup: npx expo install react-native-mmkv. Import: import { MMKV } from 'react-native-mmkv'. Buat instance: export const storage = new MMKV(). Gunakan: storage.set('user.name', 'John'), storage.getString('user.name').

Multi-instance pattern: satu untuk app state, satu untuk cache, satu untuk user data. Masing-masing dengan ID sendiri. Lebih clean daripada gabung semua di satu storage.

Kapan MMKV vs AsyncStorage: MMKV untuk data yang sering diakses (theme, cache, user preferences). AsyncStorage untuk data yang jarang atau butuh kompatibilitas maksimal. Migration: baca dari AsyncStorage, tulis ke MMKV, hapus dari AsyncStorage.

Inti yang Perlu Dipahami

Bagian ini berfokus pada memahami keunggulan MMKV dibanding AsyncStorage., mampu menginstal dan menggunakan react-native-mmkv., dan mengerti use case yang tepat untuk MMKV vs AsyncStorage. Jangan terburu-buru menghafal istilahnya. Lebih penting untuk memahami peran setiap konsep dan kapan konsep itu muncul dalam pekerjaan web development.

Saat membaca MMKV, gunakan tujuan belajar sebagai penanda arah. Kalau kamu sudah bisa menjelaskan tujuan itu dengan kata-katamu sendiri, berarti fondasinya mulai terbentuk.

Cara Membayangkannya

MMKV seperti RAM — super cepat karena pakai memory-mapped file. AsyncStorage seperti baca dari disk — lebih lambat tapi lebih compatible. Analogi ini dipakai supaya konsep teknis tidak terasa melayang. Hubungkan setiap istilah dengan perannya: siapa yang meminta, siapa yang memproses, data apa yang berpindah, dan hasil apa yang diharapkan.

Kalau analoginya sudah terasa masuk akal, barulah lihat istilah teknisnya. Cara ini membuat materi lebih mudah dipahami daripada langsung menghafal definisi.

Saat Melihat Contoh Kode

Contoh kode pada chapter ini memakai bahasa tsx. Bacalah contoh kode sebagai ilustrasi alur, bukan sebagai bagian yang harus langsung dihafal. MMKV instance dibuat sekali di module level. useMMKVString hook untuk reaktivitas — update state + write ke MMKV, konsisten.

Perhatikan nama fungsi, urutan langkah, dan data yang berpindah. Biasanya tiga hal itu sudah cukup untuk memahami hubungan antara teori dan praktik.

Konteks dalam Perjalanan Belajar

Setiap konsep di platform ini dipilih karena dipakai di industri. Fokus pada pemahaman, bukan hafalan.

Kamu sudah di bagian lanjutan. Mulai pikirkan bagaimana konsep ini dipakai di dunia kerja — bukan hanya untuk belajar, tapi untuk membangun produk nyata.

Gunakan pertanyaan reflektif dan prompt AI di akhir chapter sebagai latihan aktif. Membaca saja tidak cukup — kamu perlu menjelaskan ulang dengan kata-katamu sendiri.

Contoh Kode

tsx
import { MMKV } from "react-native-mmkv";

export const appStorage = new MMKV({ id: "app" });
export const cacheStorage = new MMKV({ id: "cache" });

function useMMKVString(key: string) {
  const [value, setValue] = useState(appStorage.getString(key) ?? "");
  const update = (v: string) => { appStorage.set(key, v); setValue(v); };
  return [value, update] as const;
}

Penjelasan Kode

MMKV instance dibuat sekali di module level. useMMKVString hook untuk reaktivitas — update state + write ke MMKV, konsisten.

Prompt AI

Bandingkan MMKV, AsyncStorage, dan WatermelonDB untuk use case: (a) menyimpan token auth, (b) menyimpan 1000 catatan offline dengan query, (c) menyimpan preferensi user. Rekomendasikan mana yang tepat untuk masing-masing.

Pertanyaan Reflektif

Cek performa AsyncStorage vs MMKV di aplikasimu: write 1000 items, baca 1000 items. Benchmark waktunya. Apakah perbedaannya signifikan?