RFC: let experimental_createPersister's serialize/deserialize only run on data of query

[Jack-Works]

Our serializer keeps non-JSON objects into JSON objects and adds additional meta information. Currently, it runs serialized on the whole PersistedClient. The serialized object therefore contains a lot of unnecessary meta information.

If the serializer is run on each data, it can be like this and you can see it is much smaller:

This is the code I'm using to create this result:

const asyncStoragePersister = createAsyncStoragePersister({
    storage: {
        async getItem(k) {
            const v = await browser.storage.local.get(k)
            return v[k]
        },
        setItem(k, v) {
            return browser.storage.local.set({ [k]: v })
        },
        removeItem(key) {
            return browser.storage.local.remove(key)
        },
    },
    serialize: (data) => {
        const next = produce(data, (data) => {
            data.clientState.queries.forEach((query) => {
                for (const key in query.state) {
                    // we're doing the javascript-ish things
                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                    // @ts-expect-error
                    query.state[key] = simpleSerializer.serialization(query.state[key]) as any
                }
            })
        })
        return next as any
    },
    deserialize: (_data) => {
        const data = _data as unknown as PersistedClient
        data.clientState.queries.forEach((query) => {
            for (const key in query.state) {
                // we're doing the javascript-ish things
                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                // @ts-expect-error
                query.state[key] = simpleSerializer.deserialization(query.state[key]) as any
            }
        })
        return data
    },
    key: 'react-query',
    throttleTime: 1000,
})

[TkDodo]

we need to serialize the whole queryState because that's what is needed to properly restore a query:

query/packages/query-persist-client-core/src/createPersister.ts

Lines 146 to 154 in 462c557

	storage.setItem(
	storageKey,
	serialize({
	state: query.state,
	queryKey: query.queryKey,
	queryHash: query.queryHash,
	buster: buster,
	}),
	)

But you can customize the serialize function and exclude things you don't want.

[Jack-Works]

so is the serialization I made expected if I want to exclude things?

    serialize: (data) => {
        const next = produce(data, (data) => {
            data.clientState.queries.forEach((query) => {
                for (const key in query.state) {
                    // we're doing the javascript-ish things
                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                    // @ts-expect-error
                    query.state[key] = simpleSerializer.serialization(query.state[key]) as any
                }
            })
        })
        return next as any
    },

[TkDodo]

I think serialize needs to return a string, or something that can be stored in the storage, but generally, yes.

[Jack-Works]

Yes, our storage supports JSON-like data.