lit-state VS live_state

The reason React uses a virtual DOM is because when React started, there were no (advanced) HTML templates yet. And it made it easy to setup listeners on elements, instead of manually adding it with `addEventListener()` and possibly remove them again with `removeEventListener()`. So the virtual DOM was really a game changer.

But Lit templates solve this problems in a more browser integrated way, without the need of a virtual DOM. How you manage the state is free to your choice, that is also not something exclusive to React and your favorite pattern can also be used with Lit. I wrote a tiny state management library (LitState [0]) which makes it very easy for multiple components to share the same state and stay in sync. I personally find it much more convenient and cleaner than any other state library I've used before. And it integrates very nicely with Lit.

[0]: https://github.com/gitaarik/lit-state

Since you mention that state management is an unsolved problem with Web Components, I thought I would share a project that aims to bring a solution: https://github.com/launchscout/live_state. The basic pattern and idea of LiveState is "dispatch events, subscribe to state". The events and state updates are sent over a websocket connection, and the front end and back end libraries are a thin layer over Phoenix Channels. Currently, event handler functions are written in Elixir, but work is underway to allow them to be written in any language that compiles to WebAssembly.

We have switched to Elixir and Phoenix as our go to stack gradually over the last 5 years. We've found that LiveView in particular, with it's ability to avoid a separate front-end framework altogether, has let us deliver applications to clients in a significantly more productive way. We were a rails shop back in the day, and were able to build things very quickly. When the whole front-end framework thing got big, it slowed us down a lot because we were building two applications, essentially. Now that we are able to go fast again we (and our clients) are enjoying things a lot more.

I should also say that if you do need to use a separate front-end for whatever reason, I've built a thing called LiveState: https://github.com/launchscout/live_state that lets you keep things far simpler and gives a "LiveView like" experience.

Another option would be https://github.com/launchscout/live_state

Thank you, haven't seen this before. Similar to LiveState[0] also

[0] https://github.com/launchscout/live_state

I've been working on a thing to manage state via phoenix channels called live_state. The basic is idea is the front end code dispatches events which are sent up the channel, and receives state updates which are sent down the channel. The initial client I've done is js, and examples are for custom elements, but it should be fairly portable if it is of interest. I gave a talk on it at Elixirconf, video should be up eventually.