SSR support

[jason89521]

My current idea is to hydrate based on different accessors. The API might look like this:

const postAdapter = createPaginationAdapter({});
const postModel = createModel(initialModel);
const getPostById = postModel.defineAccessor('normal', {
    // configuration
});

function Page({ post }) {
    useHydrate(getPostById(post.id), () => {
        postModel.mutate(model => {
            postAdapter.upsertOne(model, post)
        })
    })
}

The useHydrate function will record the provided accessor and execute the function if the current accessor hasn't been recorded yet. When the accessor changes, it removes the previously recorded one and records the new one. In the example above, this ensures that when post changes, we can update the model in real-time.

However, this approach has a drawback. Developers need to place useHydrate at the top level of the component tree to manage accessors centrally and avoid duplicate accessors being passed. Additionally, attention needs to be paid to which models need to be hydrated on which pages to prevent data from being missed.

[jason89521]

Should provide a way to create new state in server to prevent from mutating the global model's state directly in server. It would cause state pollution.