mpdairy / posh

A luxuriously simple and powerful way to make front-ends with DataScript and Reagent in Clojure.
Eclipse Public License 1.0
460 stars 45 forks source link

Example usage without reagent? #35

Open lilactown opened 5 years ago

lilactown commented 5 years ago

I'm looking at integrating this with plain React + Hooks. So I'm, at the moment, missing the reactive bits that I would use to fill in :ratom and :make-reaction.

I could easily use the reagent plugin and wire it up to execute React updates on reset, but I'd rather not depend on reagent at all.

Is it possible to just use posh's posh.lib.ratom? I see it's used mainly for CLJ, but AFAICT it seems to be a full implementation in CLJS as well. Can anyone confirm it would suffice?

alexandergunnarson commented 5 years ago

@Lokeh there is a full implementation in CLJS, yes (haven't tested recently if it works; I know it was modified at one point). However posh.lib.ratom as implemented in CLJS is not perfectly general to all React implementations (yet); it relies on queueing/dequeueing behavior implemented in Reagent in order to actually make the reactivity work with rendering:

https://github.com/reagent-project/reagent/blob/4c369531ce2a61cb133a242124617a159a39d9b4/src/reagent/impl/batching.cljs#L32-L39

That said it might not be terribly hard to hook up.

lilactown commented 5 years ago

Right, I think as long as I can make a reaction that triggers the React render, that would be enough. e.g.:

https://github.com/Lokeh/hooks-demo/blob/master/src/hooks_demo/hooks.cljs#L41

Or even just using add-watch:

https://github.com/Lokeh/hooks-demo/blob/master/src/hooks_demo/hooks.cljs#L13

alexandergunnarson commented 5 years ago

Haven't checked everything about the code you posted, but on first glance it looks reasonable to me!

sparkofreason commented 5 years ago

I'd like to take this one (several?) step further, and use the machinery in posh to be able to detect when queries change. I'm working on a simple forward-chaining rules system based on Datascript, currently just brute force evaluating every query from the LHS of rules on every transaction, obviously inefficient. Posh appears to at least partially address this, but I think I need to hook in at a lower level than a "reaction". What I probably want is to be able to transact data, then get the list of queries whose results have changed and the delta in query results. Looks like posh does at least some of this, so any pointers to help me avoid reinventing wheels appreciated.

alexandergunnarson commented 5 years ago

What I probably want is to be able to transact data, then get the list of queries whose results have changed and the delta in query results. -> I also want this @sparkofreason. I'm sure Posh already does this in some way. It appears to me that in https://github.com/mpdairy/posh/blob/aeaa9c9a218ffb6b6be94631c878f59ca693392b/src/posh/core.cljc#L121 Posh converts a query to datom-match-patterns, and then every time a transaction occurs, in https://github.com/mpdairy/posh/blob/aeaa9c9a218ffb6b6be94631c878f59ca693392b/src/posh/core.cljc#L198 Posh takes the changed datoms from :tx-data and in https://github.com/mpdairy/posh/blob/aeaa9c9a218ffb6b6be94631c878f59ca693392b/src/posh/lib/datom_matcher.cljc#L24 matches them against the datom-match-patterns it has cached.

Not sure how it correlates patterns to queries, but that should at least get you most of the way.

xlfe commented 4 years ago

@Lokeh @alexandergunnarson I know this is an old thread, but I came across it as I was looking for a method to use https://github.com/tonsky/datascript and https://github.com/Lokeh/helix and the functionality posh provides obviously bridges the gap.

I'm wondering if there is any examples of how to combine posh and helix?

It looks like @denistakeda and @fpischedda are close to getting rum support added to posh and I wonder if a similar approach might work with helix too... ?

denistakeda commented 4 years ago

Helo @xlfe . I know nothing of helix, but I'm sure posh doesn't have out of the box support for it. But it may coincidentally work if it uses atoms to model state

lilactown commented 4 years ago

helix doesn't really add anything on top of React (runtime) wise, so it doesn't include any additional tools for external state management.

Reading the PR above, it looks like posh needs some 3rd party mechanism for creating and deriving from reactive atoms. That is outside the scope of helix. I am currently working on a stand alone library for that sort of reactive dataflow programming for external state, but I wouldn't suggest using it for now.

I'm not sure what to recommend in the mean time, since both rum and reagent bundle their reactive atom code alongside their code for creating components, which obviously you don't want. You could try and use rum or reagent's reactive atom machinery and create a custom hook for interoping with them, but it might inflate your bundle size since it could include code that you won't use.

I wish I had a better answer right now. Cheers!

alexandergunnarson commented 4 years ago

@xlfe Not sure how Helix works internally but when you say bridge Datascript and Posh with \<React library of choice>, the place to look for extending Posh to other non-Reagent React libraries would be here:

https://github.com/mpdairy/posh/blob/master/src/posh/reagent.cljs

And this namespace provides a general reactive atom implementation, lifted from Reagent:

https://github.com/mpdairy/posh/blob/master/src/posh/lib/ratom.cljc

AFAIK Posh doesn't have anything out-of-the-box for this (seems like this lib hasn't changed much in a while), but it doesn't seem like an extraordinary effort to make it work.

xlfe commented 3 years ago

thanks all for responding! lots of food for thought.

@Lokeh look forward to seeing where you go with helix and serenity

@alexandergunnarson thanks for those tips

I also came across some other relevant issues and projects https://github.com/tonsky/datascript/issues/132 https://github.com/tonsky/datascript/pull/12 https://github.com/sixthnormal/clj-3df https://github.com/hiposfer/rata