A fairly unique approach to state management using encrypted asynchronous state updates.

It is not production-ready. I’m working on it to use in my own projects. It isn’t reviewed or audited by a third-party, so I can’t recommend you use it in your own code. Sharing for testing and demo purposes only.

TLDR; The title of this post.

Feel free to reach out for clarity instead of reading the code/docs.

I was working on “react-like syntax for webcomponents”. I started off with an approach for asynchronous state management so that components outside the shadow-root could receive updates. (The events are also encrypted to secure against things like browser extensions.)

https://positive-intentions.com/docs/projects/dim/async-state-management

It then made sense to be able to persist that data so it can work between page releoads.

https://positive-intentions.com/docs/projects/dim/bottom-up-storage

The result looks and works like the following when used in a project.

https://positive-intentions.com/docs/projects/dim/encrypted-store

The Dim framework seems like a dead-end. I wanted to try the hook out on my existing React projects. So I created the equivalent React hook.

https://positive-intentions.com/docs/projects/dim/use-dim-store-react

I find it to be performant and I want to push the scale of the approach, so I am in the process of testing it out on my projects. A notable use-case there is storing encrypted files at rest.

Feel free to reach out for clarity.

  • gwl [he/him]
    1·
    6 days ago

    It could be neat to get a compare/contrast against other async state hooks (Tanstack Query, react-async-hook, the new built-in of use())

    • xoron@programming.devOP
      1·
      6 days ago

      Those are useful hooks for their own purpose. My approach might be more comparable to redux.

      In contrast to redux, in this approach, we can update a state value and all other components listening will receive and update accordingly. Redux does this in a deterministic render and compares the vdom for what to update.

      The origins on my approach is from trying to create it for webcomponents where components between different shadow-roots need to share an update.