Fork me on GitHub
#fulcro
<
2019-11-12
>
thheller20:11:18

@tony.kay did you experiment with react hooks a while back? I vaguely remember a use-fulcro something? was that something you actually implemented?

tony.kay20:11:33

Hey there. I did experiment. I have not implemented.

tony.kay20:11:08

It would not be terribly hard to do, I just have no personal need for it, and have other things I am trying to get done 🙂

thheller20:11:36

yeah no worries. just thought I could maybe use it to figure out how to get my vdom stuff play nice with fulcro 🙂

tony.kay20:11:51

so, the vdom stuff is prob easier

thheller20:11:54

kinda tired of react and would like to get rid of it 🙂

tony.kay20:11:02

how close are you to having something working well enough to use?

tony.kay20:11:38

If I remember right, you have no need of Fulcro controlling targeted refresh, right? Your macros kind of figure out what can change and auto-target it?

thheller20:11:13

I have most of the vdom stuff figured out and working. not ready for public use but working.

henrik14:11:17

Is this the Arborist stuff?

henrik16:11:12

Exciting times. Brilliant name as well, I hope you’ll stick with it.

thheller16:11:53

(ns shadow.grove
  "grove - a small wood or forested area (ie. trees)

thheller16:11:58

arborist for the vdom stuff 😉

thheller16:11:15

grove for the framework parts 😉

henrik18:11:34

A wealth of unusual words to take from there, “copse”, “weald”, “thicket”.

thheller18:11:08

thicket was my second choice indeed

henrik18:11:15

(Unusual as library names, not necessarily in common speech)

thheller18:11:46

just wanted something to do with trees 😛

tony.kay20:11:51

so, do you always pretend to render “from root”?

thheller20:11:43

no, rarely actually. more like the ident-optimized stuff

thheller20:11:29

I have some basic db normalization working too but I'd much rather not re-invent all that stuff and just let fulcro do it 🙂

thheller20:11:42

but I can dig into fulcro myself

thheller20:11:50

just thought you maybe had some prior hook work

tony.kay20:11:18

ok, so you want Fulcro to pull props for a UI component and render it

tony.kay20:11:27

so, you’ll need indexing

tony.kay20:11:25

There really isn’t a lot to it. The ident-optimized render algorithm would be pretty much unchanged, except you would not call React’s setProps, but would instead trigger whatever your equivalent is for refreshing a component.

tony.kay20:11:53

the indexes need to be built for the on-screen components by a componentDidMount equivalent…see defsc code for what that looks like…

thheller20:11:05

will do. thx.

tony.kay20:11:13

sure…just ask if you need any help

tony.kay20:11:13

Glad to integrate any level of “plug-in” support you need to make it easy to select as an option. I guess to make it seamless we’d have to figure out how to get the defsc code generation working right…but I think that’s mostly in the configure-component! function now, so it would actually probably be pretty easy…just macro madness in terms of making sure the “hook” is configured before anything compiles.

thheller20:11:09

I have a todomvc example that looks something like this for a root query

thheller20:11:11

(defc ui-root [props state]
  [query
   (app/query [::filtered-todos
               ::editing
               ::num-total
               ::num-active
               ::num-completed])

thheller20:11:44

so just need to figure out the bits to bridge to fulcro

thheller20:11:38

I'll let you know if I get something working

tony.kay20:11:26

where is the join to the children?

tony.kay20:11:44

and is there any reason not to use defsc?

thheller20:11:57

not implemented 😛

thheller20:11:34

(defc todo-item [{:keys [todo]} state]
  [{::keys [completed? editing? todo-text]}
   (app/query todo [::todo-text
                    ::editing?
                    ::completed?])

thheller20:11:53

the children just run their own query from their ident (`todo` in that example)

tony.kay20:11:33

Fulcro needs a root index…

thheller20:11:38

thats just syntax sugar for [{todo [::todo-text ...]}] take (get result todo)

thheller20:11:22

yes, I would add that for the fulcro stuff. overkill for my mini impl 😛

thheller20:11:19

btw one thing I experimented with is creating a TransactedData type that basically acts like a map and delegates to the actual state

thheller20:11:36

but also records which keys were accessed, updated or removed

thheller20:11:48

so kinda like an alternative to dirty checking

thheller20:11:08

not sure thats actually useful yet but seems kinda nice

thheller20:11:14

sucks for nested maps though

tony.kay20:11:44

cool..interested to see where that goes. So, if I were tring to set up Fulcro with an alt rendering system, here’s what I’d do: 1. I’d make some way to configure which function is used by defsc instead of the hard-coded configure-component! 2. I’d figure out something similar for setting the function to call instead of setProps in ident-optimized render There’s already a way to set what function is root-render!. Then you should be able to make something that works with unmodified Fulcro apps (but either ignores or implements the lifecycle methods, of course).

tony.kay20:11:42

components just need to be able to return their options map (see component-options) for all of the core algs in Fulcro itself.

thheller20:11:44

I doubt that unmodified fulcro apps can ever work. actually quite a few differences from react

thheller20:11:26

so unlikely defsc is gonna work. thats why I asked about hooks, that is much closer to what I have

tony.kay20:11:53

So, Fulcro wants to render once from root, then is happy to have you control what renders afterwards.

tony.kay20:11:27

but not sure why you think that unmodified Fulcro would not work (again, assuming you don’t use lifecycle methods)

thheller20:11:34

so all I need is one big query and then pass that data down the tree somehow?

tony.kay20:11:55

Fulcro does the root-level query, makes the props, passes it to the “root render”

tony.kay20:11:58

(configurable).

tony.kay20:11:11

THEN it uses optimized renders to do refresh, which is compltely configurable

tony.kay20:11:29

except for hot code reload, which may call root-render with a “force” to force the UI to update

thheller20:11:43

ok, I'll see where to code takes me 🙂

tony.kay20:11:54

the ident-optimized render will also use root render if there is no ident on a component that needs refresh

tony.kay20:11:13

because otherwise it cannot construct props for that component

tony.kay20:11:57

Almost everything in Fulcro will work if your component sets up enough stuff to respond properly to the component-options method (I think you’d also have to make it so that things like react-component? return true…but yes, see where the code takes you. The component-options support (the open map of options) is critical for most of the compat.

tony.kay20:11:28

you’ll break lots of core functionality if you break the ident/query model

tony.kay20:11:08

But there’s almost nothing special about React, and I can’t think of any reason why almost any approach wouldn’t work for rendering

tony.kay20:11:45

but since js functions can have things just set on them, that should all be pretty easy

tony.kay20:11:11

The “refresh by UI keyword” requires the index from class->component (on-screen component), which is constructed on the fly by React lifecycle normally.

tony.kay21:11:16

@thheller I found the old code where I was playing with hooks…not sure how useful it is, but here it is: https://github.com/fulcrologic/fulcro/blob/feature/react-play/src/main/play/main.cljs

👍 4
tony.kay21:11:55

none of that is the actual code you’d use with the current APIs…that was all just exploration that sort of mimics how it would be done