# Data flow — pmndrs/valtio

> Canonical page: https://codevetter.com/unpack/valtio/data-flow

# Data flow — pmndrs/valtio

Scanned commit 26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d (2026-10-01). Generated by codevetter codevetter 1.15.0 on 2026-10-02.

Source inspection; upstream code and tests were not executed.

Object inputs become mutation-tracking proxies backed by identity caches and version propagation. Snapshot creation translates live state into cached read-only properties, and React adds access tracking before rendering. Reactive collections keep indexing state outside their proxied storage arrays. Application and website adapters then translate changes into browser storage, DOM updates, compiled documentation, or extension messages.
- proxy(baseObject) validates the object, checks proxyCache, creates and registers its proxy/state tuple, then assigns writable own values through the proxy to initialize nested tracking; this operates on the original base object. — [src/vanilla.ts#L186-L193](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla.ts#L186-L193) [src/vanilla.ts#L278-L299](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla.ts#L278-L299) [docs/guides/migrating-to-v2.mdx#L16-L20](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/docs/guides/migrating-to-v2.mdx#L16-L20)
- The set trap compares old and incoming identities, removes the previous child relationship, unwraps proxy-compare values, recursively proxies eligible replacements, installs their relationship, writes through Reflect.set, and notifies. — [src/vanilla.ts#L137-L156](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla.ts#L137-L156)
- notifyUpdate advances a shared version and sends listeners the new version; child listeners prepend their property to operation paths, while ensureVersion recursively checks child versions when the global check version changes. — [src/vanilla.ts#L194-L226](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla.ts#L194-L226)
- snapshot() obtains the target and current version; createSnapshotDefault reuses matching cached snapshots, caches new containers before traversing keys, preserves prototypes/enumerability, evaluates values through Reflect.get, and snapshots tracked children. — [src/vanilla.ts#L78-L119](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla.ts#L78-L119) [src/vanilla.ts#L354-L360](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla.ts#L354-L360)
- useSnapshot() subscribes through useSyncExternalStore, obtains snapshots for client and server reads, reuses the previous snapshot when affected properties are unchanged outside render, and returns a proxy-compare wrapper that records future reads. — [src/react.ts#L123-L174](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/react.ts#L123-L174)
- proxyMap stores values in proxied data slots and maps keys to slot indexes in a closure; proxySet similarly indexes normalized values. Their epoch properties support structural tracking, and snapshot-index WeakMaps select historical lookup indexes. — [src/vanilla/utils/proxyMap.ts#L55-L69](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla/utils/proxyMap.ts#L55-L69) [src/vanilla/utils/proxyMap.ts#L94-L142](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla/utils/proxyMap.ts#L94-L142) [src/vanilla/utils/proxySet.ts#L57-L81](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla/utils/proxySet.ts#L57-L81) [src/vanilla/utils/proxySet.ts#L188-L227](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/src/vanilla/utils/proxySet.ts#L188-L227)
- The photo booth loads localforage's images into camera.images, then a store subscription writes snapshot images back and redraws controls/images; the localStorage persistence recipe separately serializes application state under the key foo. — [examples/photo-booth-vanillajs/src/main.js#L26-L56](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/examples/photo-booth-vanillajs/src/main.js#L26-L56) [docs/how-tos/how-to-persist-states.mdx#L9-L24](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/docs/how-tos/how-to-persist-states.mdx#L9-L24)
- Documentation flows from recursively filtered .md/.mdx files through slug generation, filesystem reads, gray-matter parsing, bundleMDX plugins, and emitted assets; getStaticProps supplies compiled code to getMDXComponent for browser rendering. — [website/_utils/file_helpers.ts#L19-L39](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/website/_utils/file_helpers.ts#L19-L39) [website/lib/mdx.ts#L95-L127](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/website/lib/mdx.ts#L95-L127) [website/lib/mdx.ts#L129-L177](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/website/lib/mdx.ts#L129-L177) [website/components/MDXRenderer/MDXRenderer.tsx#L10-L17](https://github.com/pmndrs/valtio/blob/26d8ca8cb6e5bb3b9516d429e50bc5aab1f42e0d/website/components/MDXRenderer/MDXRenderer.tsx#L10-L17)

Every claim links to its cited files at the pinned commit. Citations identify source evidence; they do not establish runtime correctness. Independent CodeVetter scan — not reviewed by upstream maintainers.

## Public product links

- [CodeVetter](https://codevetter.com/)
- [Download](https://codevetter.com/download)
- [Documentation](https://codevetter.com/docs/)
- [Source](https://github.com/Codevetter/codevetter)
