feat: V3 🫴

[mrousavy]

V3

react-native-mmkv V3 brings a ton of new features! 🥳

Bridgeless TurboModule

react-native-mmkv is now a bridgeless C++ TurboModule.

This means, there is no more Java or Objective-C code required for module initialization, everything is handled synchronously on the JS thread.

react-native-mmkv already was a JSI module before, so the performance improvements are only marginal.

But the codebase is now shared across iOS and Android, so the implementation is no longer duplicated! 🥳

New APIs: trim() and size

V3 adds two new APIs to react-native-mmkv:

• trim(): Trim a MMKV storage unit. This can be called after deleting a bunch of keys (as deletions don't resize the storage), or when receiving a memory warning by the OS. You don't need to call this though.
• size: Gets the current actual size of the storage unit, in bytes.

Example:

const storage = new MMKV()
if (storage.size >= 400) {
  storage.trim()
}

New config option: mode

A new option has been added to the MMKV constructor: mode.

mode can be one of two values:

• Mode.SINGLE_PROCESS: The MMKV instance is only used from a single process (this app).
• Mode.MULTI_PROCESS: The MMKV instance may be used from multiple processes, such as app clips, share extensions or background services.

Example:

const storage = new MMKV({
  id: 'shared-storage',
  mode: Mode.MULTI_PROCESS
})

Buffer improvements

The Buffer APIs have improved.

1. Instead of Uint8Array, getBuffer(...) and set(.., buffer) now use ArrayBuffer as a type. If you want to write Uint8's, you can still use new Uint8Array(arrayBuffer), but ArrayBuffer is the way to go in most cases.
2. Performance improvements: The buffer APIs got much faster in 3 locations:
   1. ArrayBuffer is faster to use than Uint8Array/TypedArray
   2. set(key, buffer) now performs one less copy, which could yield huge performance improvements when working with larger buffers.
   3. getBuffer(...) now performs one less copy, which could yield huge performance improvements when working with larger buffers.

MMKV Core on iOS

Since react-native-mmkv V3 is now a cross-platform C++ TurboModule (or xplat/"CxxTurboModule"), we are also now using MMKV-Core instead of MMKV-iOS for the iOS codebase.

For simple values (such as numbers or booleans) this now uses C++ directly, instead of going through Objective-C/NSObjects. This could potentially lead to another performance gain.

---

Note: react-native-mmkv V3 requires react-native 0.74 or higher, and requires the new architecture (TurboModules/CodeGen) to be enabled.

For the sake of simplicity, there will be no backwards compatibility for old architecture (bridge), or RN <0.73.

[github-actions]

yarn.lock changes

Summary

Status	Count
	50
	94
	50
	43

Click to toggle table visibility

Name	Status	Previous	Current
@aashutoshrathi/word-wrap		-	1.2.6
@babel/compat-data		7.24.4	7.24.1
@babel/core		7.24.4	7.24.3
@babel/generator		7.24.4	7.24.1
@babel/helper-create-class-features-plugin		7.24.4	7.24.1
@babel/helper-define-polyfill-provider		0.6.2	0.6.1
@babel/helpers		7.24.4	7.24.1
@babel/parser		7.24.4	7.24.1
@babel/plugin-bugfix-firefox-class-in-computed-class-key		7.24.4	-
@babel/plugin-proposal-logical-assignment-operators		-	7.20.7
@babel/plugin-transform-block-scoping		7.24.4	7.24.1
@babel/plugin-transform-class-static-block		7.24.4	7.24.1
@babel/plugin-transform-typescript		7.24.4	7.24.1
@babel/preset-env		7.24.4	7.24.3
@babel/runtime		7.24.4	7.24.1
@firmnav/eslint-github-actions-formatter		-	1.0.1
@humanwhocodes/object-schema		2.0.3	2.0.2
@inquirer/figures		-	1.0.1
@isaacs/ttlcache		-	1.4.1
@ljharb/through		-	2.3.13
@octokit/auth-token		3.0.4	4.0.0
@octokit/core		4.2.4	5.2.0
@octokit/endpoint		7.0.6	9.0.5
@octokit/graphql		5.0.6	7.1.0
@octokit/openapi-types		18.1.1	22.1.0
@octokit/plugin-paginate-rest		6.1.2	9.2.1
@octokit/plugin-request-log		1.0.4	4.0.1
@octokit/plugin-rest-endpoint-methods		7.2.3	10.4.1
@octokit/request		6.2.8	8.4.0
@octokit/request-error		3.0.3	5.1.0
@octokit/rest		19.0.11	20.1.0
@octokit/tsconfig		1.0.2	-
@octokit/types		10.0.0	13.4.1
@react-native-community/cli		10.2.7	14.0.0-alpha.4
@react-native-community/cli-clean		10.1.1	14.0.0-alpha.4
@react-native-community/cli-config		10.1.1	14.0.0-alpha.4
@react-native-community/cli-debugger-ui		10.0.0	14.0.0-alpha.4
@react-native-community/cli-doctor		10.2.7	14.0.0-alpha.4
@react-native-community/cli-hermes		10.2.7	-
@react-native-community/cli-platform-android		10.2.0	14.0.0-alpha.4
@react-native-community/cli-platform-apple		-	14.0.0-alpha.4
@react-native-community/cli-platform-ios		10.2.5	14.0.0-alpha.4
@react-native-community/cli-plugin-metro		10.2.3	-
@react-native-community/cli-server-api		10.1.1	14.0.0-alpha.4
@react-native-community/cli-tools		10.1.1	14.0.0-alpha.4
@react-native-community/cli-types		10.0.0	14.0.0-alpha.4
@react-native-community/eslint-config		3.2.0	-
@react-native-community/eslint-plugin		1.3.0	-
@react-native/assets		1.0.0	-
@react-native/assets-registry		-	0.74.81
@react-native/babel-plugin-codegen		-	0.74.81
@react-native/babel-preset		-	0.74.81
@react-native/codegen		-	0.74.81
@react-native/community-cli-plugin		-	0.74.81
@react-native/debugger-frontend		-	0.74.81
@react-native/dev-middleware		-	0.74.81
@react-native/eslint-config		-	0.74.81
@react-native/eslint-plugin		-	0.74.81
@react-native/gradle-plugin		-	0.74.81
@react-native/js-polyfills		-	0.74.81
@react-native/metro-babel-transformer		-	0.74.81
@react-native/normalize-color		2.1.0	-
@react-native/normalize-colors		-	0.74.81
@react-native/polyfills		2.0.0	-
@react-native/virtualized-lists		-	0.74.81
@rnx-kit/chromium-edge-launcher		-	1.0.0
@sindresorhus/merge-streams		-	2.3.0
@testing-library/react-native		12.4.5	12.5.0
@tootallnate/quickjs-emscripten		-	0.23.0
@tsconfig/react-native		3.0.5	-
@types/minimist		-	1.2.5
@types/node		20.12.7	18.19.26
@types/node-forge		-	1.3.11
@types/react-test-renderer		18.3.0	-
@types/scheduler		-	0.16.8
@typescript-eslint/eslint-plugin		7.7.1	6.21.0
@typescript-eslint/parser		7.7.1	6.21.0
@typescript-eslint/scope-manager		7.7.1	6.21.0
@typescript-eslint/type-utils		7.7.1	6.21.0
@typescript-eslint/types		7.7.1	6.21.0
@typescript-eslint/typescript-estree		7.7.1	6.21.0
@typescript-eslint/utils		7.7.1	6.21.0
@typescript-eslint/visitor-keys		7.7.1	6.21.0
absolute-path		0.0.0	-
acorn-walk		8.3.2	-
agent-base		7.1.1	7.1.0
aggregate-error		3.1.0	4.0.1
arrify		-	1.0.1
async		3.2.5	-
babel-plugin-polyfill-corejs2		0.4.11	0.4.10
babel-plugin-polyfill-regenerator		0.6.2	0.6.1
babel-plugin-syntax-trailing-function-commas		7.0.0-beta.0	-
babel-preset-fbjs		3.4.0	-
big-integer		1.6.52	-
bl		5.1.0	4.1.0
bplist-parser		0.2.0	-
buffer		6.0.3	5.7.1
bundle-name		3.0.0	4.1.0
camelcase-keys		-	7.0.2
caniuse-lite		1.0.30001614	1.0.30001600
chrome-launcher		-	0.15.2
cjs-module-lexer		1.3.1	1.2.3
clean-stack		2.2.0	4.2.0
core-js-compat		3.37.0	3.36.1
cosmiconfig		8.1.3	9.0.0
dayjs		1.11.11	1.11.10
decamelize		1.2.0	5.0.1
decamelize-keys		-	1.1.1
dedent		1.5.3	1.5.1
default-browser		4.0.0	5.2.1
default-browser-id		3.0.0	5.0.0
degenerator		4.0.4	5.0.1
del		6.1.1	7.1.0
del-cli		-	5.1.0
deprecated-react-native-prop-types		3.0.2	-
electron-to-chromium		1.4.750	1.4.715
emoji-regex		9.2.2	10.3.0
env-paths		-	2.2.1
envinfo		7.13.0	7.11.1
es-abstract		1.23.3	1.23.2
es-iterator-helpers		1.0.19	1.0.18
escodegen		1.14.3	2.1.0
eslint-plugin-ft-flow		3.0.7	2.0.3
eslint-plugin-jest		27.9.0	26.9.0
eslint-plugin-react-hooks		4.6.2	4.6.0
execa		7.2.0	8.0.1
figures		5.0.0	-
flow-enums-runtime		-	0.0.6
flow-parser		0.185.2	0.231.0
get-east-asian-width		-	1.2.0
get-stream		6.0.1	8.0.1
git-url-parse		13.1.0	14.0.0
globby		13.1.4	14.0.1
got		12.6.1	13.0.0
graceful-fs		4.2.10	4.2.11
hard-rejection		-	2.1.0
has-yarn		3.0.0	-
hermes-estree		0.8.0	0.20.1
hermes-parser		0.8.0	0.20.1
hermes-profile-transformer		0.0.6	-
human-signals		4.3.1	5.0.0
image-size		0.6.3	1.1.1
indent-string		4.0.0	5.0.0
inquirer		9.2.6	9.2.19
ip		1.1.9	-
is-in-ci		-	0.1.0
is-path-cwd		2.2.0	3.0.0
is-path-inside		3.0.3	4.0.0
is-plain-obj		-	1.1.0
is-plain-object		5.0.0	2.0.4
is-unicode-supported		1.3.0	2.0.0
is-wsl		2.2.0	3.1.0
is-yarn-global		0.4.1	-
issue-parser		6.0.0	7.0.0
jest-serializer		27.5.1	-
jetifier		2.0.0	-
joi		17.13.0	17.12.2
lighthouse-logger		-	1.4.2
log-symbols		5.1.0	6.0.0
lru-cache		10.2.2	10.2.0
map-obj		-	4.3.0
marky		-	1.2.5
metro		0.73.10	0.80.7
metro-babel-transformer		0.73.10	0.80.7
metro-cache		0.73.10	0.80.7
metro-cache-key		0.73.10	0.80.7
metro-config		0.73.10	0.80.7
metro-core		0.73.10	0.80.7
metro-file-map		0.73.10	0.80.7
metro-hermes-compiler		0.73.10	-
metro-inspector-proxy		0.73.10	-
metro-minify-terser		0.73.10	0.80.7
metro-minify-uglify		0.73.10	-
metro-react-native-babel-preset		0.77.0	-
metro-react-native-babel-transformer		0.73.10	-
metro-resolver		0.73.10	0.80.7
metro-runtime		0.73.10	0.80.7
metro-source-map		0.73.10	0.80.7
metro-symbolicate		0.73.10	0.80.7
metro-transform-plugins		0.73.10	0.80.7
metro-transform-worker		0.73.10	0.80.7
minimatch		9.0.4	9.0.3
minimist-options		-	4.1.0
mkdirp		0.5.6	1.0.4
natural-compare-lite		1.4.0	-
nice-try		1.0.5	-
node-abort-controller		-	3.1.1
node-fetch		3.3.1	3.3.2
node-forge		-	1.3.1
ob1		0.73.10	0.80.7
open		9.1.0	10.1.0
optionator		0.9.4	0.9.3
ora		6.3.1	8.0.1
p-finally		1.0.0	-
p-map		4.0.0	5.5.0
pac-proxy-agent		6.0.4	7.0.1
pac-resolver		6.0.2	7.0.1
path-type		4.0.0	5.0.0
promise.allsettled		1.0.6	1.0.7
proxy-agent		6.2.1	6.4.0
querystring		-	0.2.1
queue		-	6.0.2
react-devtools-core		4.28.5	5.0.2
react-native		0.71.19	0.74.0
react-native-builder-bob		0.20.4	0.23.2
react-native-codegen		0.71.6	-
react-native-gradle-plugin		0.71.19	-
react-refresh		0.4.3	0.14.0
redent		3.0.0	4.0.0
release-it		15.11.0	17.2.1
run-applescript		5.0.0	7.0.0
scheduler		0.23.2	0.24.0-canary-efb381bbf-20230505
selfsigned		-	2.4.1
signal-exit		3.0.7	4.1.0
slash		4.0.0	5.1.0
socks		2.8.3	2.8.1
socks-proxy-agent		8.0.3	8.0.2
source-map		0.7.4	0.6.1
stdin-discarder		0.1.0	0.2.2
string-width		5.1.2	7.1.0
strip-eof		1.0.0	-
strip-indent		3.0.0	4.0.0
temp-dir		-	2.0.0
terser		5.30.4	5.29.2
titleize		3.0.0	-
trim-newlines		-	4.1.1
type-fest		4.18.0	4.14.0
uglify-es		3.3.9	-
undici		5.28.4	5.28.3
unicorn-magic		-	0.1.0
untildify		4.0.0	-
update-notifier		6.0.2	7.0.0
use-sync-external-store		1.2.2	-
vm2		3.9.19	-
wildcard-match		5.1.2	5.1.3
word-wrap		1.2.5	-
yaml		1.10.2	2.4.1

[mrousavy]

nvm - it runs on iOS! 🎉

now to Android...

[pigeonmal]

I try beta 2, the build don't work check logs : https://pastebin.com/VUjTDFzV

I fixed that in node_modules files:

1. node_modules/react-native-mmkv/react-native.config.js
   Modified cxxModuleCMakeListsPath to CMakeLists.txt
2. Delete build folder in node_modules/react-native-mmkv/android/build/
3. Rebuild
4. THE APP AND RN MMKV WORK !!

[mrousavy]

Yea this seems like a bug in RN Community CLI. The path is wrong when rebuilding.

[mrousavy]

CI is green! 🎉🟢😍

react-native-mmkv V3 is ready 💪

I am a bit hesitant on merging this to main because it requires the new architecture...