MMKV

MMKV

MMKV: A Fast Key-Value Store

MMKV 18,748 (https://github.com/Tencent/MMKV 18,748 ) is Tencent's key-value store, written in C++ for WeChat. It memory-maps a file, so a read is a lookup in memory and a write appends to the mapped file, which the operating system flushes. react-native-mmkv 8,507 (https://github.com/mrousavy/react-native-mmkv 8,507 ) (MIT) 4.3.2 exposes it through Nitro Modules 1,954 (react-native-nitro-modules 0.37.1), a JSI binding generator, so every call is synchronous. It is not an Expo SDK 6,418 package, so npx expo install took npm 2,036 's latest, and a native rebuild is required:

Installing BookNest's three native storage librariesShell

npx expo install react-native-mmkv react-native-nitro-modules expo-sqlite expo-secure-store

Output

› Installing 2 SDK 57.0.0 compatible native modules and 2 other packages using npm
> npm install --save react-native-mmkv react-native-nitro-modules
› Added config plugins: expo-sqlite, expo-secure-store

Version 4 creates instances with createMMKV() and renamed delete() to remove(). BookNest keeps its appearance choice from NativeWind there, which Building a Dark Mode Toggle promised to persist:

src/storage/prefs.ts: settings in MMKVTypeScript

import { createMMKV } from 'react-native-mmkv';
// Small, synchronous settings: read during the first render, no await
export const prefs = createMMKV({ id: 'booknest-prefs' });
export type Scheme = 'system' | 'light' | 'dark';
export const savedScheme = () => (prefs.getString('scheme') ?? 'system') as Scheme;
export const saveScheme = (s: Scheme) => prefs.set('scheme', s);

The root layout calls setColorScheme(savedScheme()) in a useLayoutEffect. After choosing Dark and restarting, the log read color scheme: light, then color scheme: dark before the first route rendered: no loading state, no flash of a spinner. createMMKV({ encryptionKey }) encrypts an instance; keep that key in the store of Secure Storage for Secrets.

MENU