[oDot]

The problems OP tries to address are unfortunately a deep design flaw in mainstream frameworks like React and Vue. This is due to 2 properties they have:

1. They marry view hierarchy to state hierarchy

2. They make it very ergonomic to put state in components

I've been through this endless times. There are significant ways to reduce this friction, but in the end there's a tight ceiling.

This is why this kind of work feels like chasing a moving target. You always end up ruining something inherent to the framework in a pursuit to avoid the tons of footguns it's susceptible to.

It's also why I moved to Gleam and Lustre (elm architecture) and bid those PITAs farewell

[svieira]

Is this because Elm forces you to separate the model computations from the view computations, which then lets you compose the model shape in one place and the view shape in the other, or some other property of the framework that I'm not aware of?

[oDot]

Yes. In the Elm architecture it is possible (and ergonomic) to model your state separately from the view

[schneehertz]

Vue provides a computed feature that acts as a buffer layer between the view and the state, so the view and the state are not necessarily strictly bound

[oDot]

Computed is only a concept because you need a band-aid for that lack of separation. You can read more about my efforts ditching Vue here:

https://blog.nestful.app/s/the-tech-behind-nestful