feat: SolidJS port

[arv]

This is a basic SolidJS port

It does not yet figure out how to make Replicache ❤️ SolidJS. This is just a baseline to start from.

[render]

Your Render PR Server URL is https://todo-row-versioning-pr-16.onrender.com.

Follow its progress at https://dashboard.render.com/web/srv-cng698tjm4es73f1s4i0.

[arv]

Not intended to be merged to main.

[aboodman]

What are the re-rendering characteristics of this like? Seems like we should ideally only re-render the todo row that changed, not the entire list. Users often ask us to do better and re-render only the field that changed, but this doesn't seem practical.

In React, the model we've settled on is to have the container only subscribe to the keys. not the values. So the container re-renders if the list of todo IDs changes, but not their values. See reflect-draw for an example of this pattern.

I wonder if we could do something similar for Solid and/or if it's appropriate.

[arv]

My plan was to look at the rerendering behavior after getting the basics working.

In Solid when you use the For component, it uses === for the individual elements of the array to determine if it needs to rererender the child. The outer array identity does not matter.

Users often ask us to do better and re-render only the field that changed, but this doesn't seem practical.

I agree that this does not seem to be practical in general. In Replicache we never mutate the data and we go a long way to ensure we minimize the number of clones. To support this deep mutation that would trigger minimal render updates the data needs to be cloned and mutated.

I do think that there might be some utilities that can be used in SolidJS apps that would map from a key to a solid store. And when the value of that key changes it would use solid's reconcile to update the store to only mutate the innards of the object. Strawman:

const item = createReplicacheValueStore(rep, key);
return <div>{item.description}</div>

item would be a reactive object. The value stored in Replicache be an object (array is fine too). It would subscribe to the key and item would be reactive just like a solid store.

We could also have version that supports scalars but then the item needs to be a function or an object with a value property.

Then we could maybe provide similar things for scan... and subscribe...

Anyway, I need to think more.

[arv]

This is getting a bit more ergonomic.

[aboodman]

Your plan makes sense, thanks for explaining!