Fork me on GitHub
#fulcro
<
2021-04-23
>
dvingo15:04:45

Hi friends, over the past few months I've been thinking on and off about handling derived data in fulcro and if we could somehow combine re-frame subscriptions with fulcro to solve this problem. I have an experiment here that shows one combination of how this could work: https://github.com/dvingo/fulcro-re-frame-playground I want to be able to use all of fulcro and not compromise on that (router, dynamic queries, mutations, state machines) and am only leveraging the subscription feature of re-frame and none of the mutation parts. The readme has more details, but the high level is that using a macro you get re-frame subscriptions generated from fulcro queries. Using these base subscriptions you can then write further subscriptions to deal with re-rendering derived data via re-frame components. This works well when your re-frame components are at the leaves of your component tree, but rendering fulcro components from the re-frame components will not always compose to root, which causes problems. I haven't played with the new fulcro hooks code but perhaps there is a way to use those here to get the benefits of fulcro with the benefits of re-frame. This is all experimental, I hope it inspires others to think about this problem and try out the code to see if there are novel ways to make writing apps even easier. The high level goal here to only ever deal with normalized data in mutations and have the subscription layer deal with determining what to re-render. I don't want to have to store denormalized data in the fulcro db or ever describe what out of band properties in the db to re-render, that should be handled for me. Some next steps to experiment with this would be to use a subscription to store an index of components by some alternative property (tasks by author or by date for example) and get the two systems to still play well together (mutating a task causes the indexed list to re-render). Hoping it inspires some more creativity in this area!

👀 15
❤️ 3
NikolaMandic15:04:40

I'm a newbie but it seems this is just what I expected from fulcro in previous question on the channel yesterday I won't say if its good or bad but it for sure is an alternative concept. I'm thinking you can implement it in at least 2 way more with different query key or with different rendering optimizer is that so? it seems to me this borrows from redux javascript library am I right?

dvingo16:04:41

Hi. I don't believe your question is related to this. If I follow correctly, you are wondering if you always need to pass props to child components, and the answer is yes. This is a fundamental design of fulcro.

dvingo16:04:43

What I described is only dealing with derived data which fulcro does not maintain in its indexes, and thus cannot update efficiently without you telling it to (or doing a crude full re-render from root)

NikolaMandic16:04:39

hm ok when I saw your post I thought that what you made is something that would work similarly as reducer in react-boilerplate like if something changes in the local database you would have subscription for it that would trigger a rerender which is what reducers do in react-boilerplate I was spending bit of time trying to use query as reducer from react-boilerplate without success I guess with your approach it would be possible. thats one of the things why I asked about props. its just latter that I found out from tutorials how does fulcro deal with this. thanks for reply. I'm still trying to get better grasp of fulcro so I'm not very competent to comment

dvingo16:04:20

Ah I see thanks for clarifying! I think it's analogous then yes. It was hard to understand without code examples.

NikolaMandic17:04:14

for what I saw in javascript world there are two approaches that compete with fulcro approach when it comes to state management thats reducers approach and rxjs approach of angular where people might chose not to go with redux but use rxjs pipes. fulcro in a way competes with them with its methods and innovating a bit. it for sure is attractive to experiment with all these ideas

donavan14:04:43

I’ve only been using Fulcro for about 4 months so take anything I say with a huge lump of salt! 😄 I’m looking forward (and I know others are too) for a good solution for derived data in Fulcro. Having used some code that tackles these concerns the two key takeaways I have is the solution must not leak (i.e. where you use it must be totally transparent to surrounding code) and it must fit seamlessly with Fulcro’s ‘philosophy’ (for lack of a better word). Caveat, I’ve only just skimmed the readme; but the extra ::rfm/subs key gives me pause for concern. How would you compare your solution to Pathom3's take on derived state (computed graph nodes)? (Caveat I also haven’t looked too deep into Pathom3 yet! 😄 )

dvingo14:04:38

This is not my solution, it is non-abstracted re-frame subscriptions https://day8.github.io/re-frame/correcting-a-wrong/

donavan15:04:42

I’m not sure what you mean? (FWIW I know re-frame pretty well so am familiar with subscriptions in general) I think the point I was not making very well is; the query is such a fundamental component of Fulcro that I feel any deviation from it (with the sideband ::subs key) should be thought about very carefully. It seems to me (again, from very little skimming of the website) that Pathom3 gives you derived state that fits in with the Fulcro query in a far more ‘natural’ way? :woman-shrugging:

donavan15:04:22

TBH, in my case a far faster quick fix would be to just use transients for the heavy caclulation part and blindly derive on each render. The JS runtime is pretty fast!

NikolaMandic21:04:15

I'm trying to use optimized-render! keyframe/render! in latest rad and I copy pasted code from video on how rendering works but so far I can't manage to reproduce that just one person updates is rad template able to do this?

tony.kay22:04:05

RAD requires multi-root renderer if you’re using SUI plugin, or some controls will not work.

Jakub Holý (HolyJak)22:04:18

Why do you want just a single person to update? Trying to optimize? I would recommend getting really familiar with Fulcro before trying to do anything fancy.

NikolaMandic22:04:11

I'm trying now to follow fulcro tutorial how rendering works and I have trouble reproducing what Mr. Kay did there in the way I tried I hope to do what he did in the video I tried copy pasting the code into rad after cloning rad as is but I guess now it does not work due to rad using another render that behaves differently than the one in tutorial. not sure if one can specify the other renderer I just trying to force the optimized one into it like in the video 🙂 now I'm falling back to code from repository in the video trying to follow step by step until I see it working trying to get my feet wet with the fulcro it looks like a really nice software

NikolaMandic23:04:36

it seems I used latest fulcro but ident optimizer is not the default anymore one has to specify it explicitly if one tries to follow tutorials with the latest fulcro if anyone searches for this in google I guess someone will spot this chat

Tyler Nisonoff21:04:24

@tony.kay r.e. the modification you recently made to m/returning What are your thoughts on a generic opts map as the additional arg rather than just query-params ? This would allow other future options such as without / other df/load! functionality I’d be happy to provide a PR if you’d like, been testing my own version

tony.kay22:04:46

seems reasonable..but have I already messed up and used a non-map as that argument?

Tyler Nisonoff22:04:24

query-params is a map, but we’d have to nest it inside another map

Tyler Nisonoff22:04:58

i dont believe you’ve pushed a release of this code fwiw, but some may be using it

tony.kay22:04:14

Ah, if I have not actually released it, then yes, let’s fix it

tony.kay22:04:28

I think you’re about the only person even aware it exists

Tyler Nisonoff22:04:41

yeah i think so as well 😄

Tyler Nisonoff22:04:54

i can add a follow-up one adding without support, but it’ll require proxying data-fetch ’s elide-query-nodes and elide-ast-nodes to a helper namespace so that mutations can use those as well

hadils23:04:38

Hi. I am working on a hybrid RAD and vanila Fulcro Expo/RN app. RAD on the backend and Fulcro on the frontend. I am getting the following warning consistently:

WARN [com.fulcrologic.fulcro.components:1777] - Component com.fulcrologic.fulcro-i18n.i18n/LocaleSelector does not INCLUDE initial state for com.fulcrologic.fulcro-i18n.i18n/Locale at join key :com.fulcrologic.fulcro-i18n.i18n/available-locales ; however,  com.fulcrologic.fulcro-i18n.i18n/Locale HAS initial state. This probably means your initial state graph is incomplete and props on com.fulcrologic.fulcro-i18n.i18n/Locale will be nil.
a
I am not using i18n anywhere in my project.