Proxy unwrapping
What problem does this feature solve?
Data persisting in IndexedDB or other storages is very common nowadays, however trying to store JS Proxy in them throw errors.
It needs to be serialized through an old and ugly JSON.parse(JSON.stringify()) while normal objects don't. This creates huge performance issues on large scale applications.
Also, trying to avoid storing Proxy in Vuex to avoid its persistence is impossible due to the very undetectable nature of Proxy
We should be able to unwrap proxy to get plain old object or at least being able to distinguish them from plain objects
What does the proposed API look like?
import { unwrapProxy, reactive } from 'vue'
// Normal situation
const proxied = reactive({ key: 'value' })
const object = unwrapProxy(proxied)
// Should be recursive
const nested = { proxied }
const nestedObject = unwrapProxy(nested). // nestedObject.proxied should be unwrapped
That's already supported:
import { toRaw } from 'vue'