Pinia Colada Normalizer

Pinia Colada — Vue's official data-fetching library, built by posva (creator of Pinia and Vue Router) — caches each query independently. Fetch the same entity from two different endpoints and you get two copies; update one and the other goes stale. This plugin normalizes entities into a shared store so every view holding that entity reads the same reference — one write, propagated everywhere, with zero per-query config.

How it works

The plugin hooks into Pinia Colada's extend API and replaces each query's entry.state with a Vue customRef: writes normalize the response into a shared entity store, reads denormalize it back into the shape the component expects. A single WebSocket push or mutation response updates the store once — every component holding that entity re-renders, automatically.

Persistence

IndexedDB by default; an optional SQLite-WASM (OPFS) engine shipped in 0.3.0 for larger datasets. Pluggable — bring your own storage engine.

Proof

• npm: pinia-colada-plugin-normalizer — published, installable today.
• posva welcomed it and validated the customRef/entry.state design in public Discussion #531 on the Pinia Colada repo itself.
• Live demo: pinia-colada-plugin-normalizer.vercel.app