Fork me on GitHub
#fulcro
<
2021-03-02
>
raspasov09:03:07

Question about fulcro (I’ve never used it in a project, but have dabbled in the documentation; also used Om.next in many projects in the past, so I’m familiar with the overall ideas): Does fulcro always re-render from the root? Or is there a strategy where it tries to optimize so that, let’s say, only a leaf component is re-rendered? In most apps, re-rendering from the root along a path to a leaf component is perfectly OK, esp. when using immutable data structures. But I’m working on an app that is quite CPU heavy under certain conditions (does ML analysis of live video) and I’m trying to minimize any re-rendering possible (even minor re-rendering is causing the ML algo to slow down, and that’s not good).

myguidingstar10:03:15

@raspasov I'm not an expert re: optimizing for performance but you can have a look at the rendering options here https://book.fulcrologic.com/#RenderingOptimizations

raspasov10:03:53

@U0E2YV1UZ thanks for the pointer, will take a look

raspasov10:03:53

This seems to be what I was looking for, thank you!

😉 1
Henry16:03:24

For more details, do check out this video from Tony's Grokking Fulcro series as well: https://www.youtube.com/watch?v=yq49mMwlH1c

👆 1
👍 1
tony.kay17:03:02

The video is definitely worth watching if custom rendering is what you’re after. That, and floating roots

tony.kay17:03:03

So, you could do something as radical as putting in a flag that completely disables rendering refresh during critical times, and then do a full-rerender when you unset the flag

raspasov15:03:05

Thank you for the input 🙂 I’ll watch the video.

tony.kay21:03:01

Also, realize that a lot of the overhead is in dev mode: Inspect + React error checks both eat up a lot of CPU.

tony.kay21:03:26

oh, duh, you should probably start with :only-refresh 😄

tony.kay21:03:28

and synchronous transactions (which do a sync refresh of only the component that invoked it). Both require there be idents on things, but that is normally what you’ve got.

raspasov08:03:38

Yes, I realize the dev mode has significant overhead (I primarily do React Native); But I know that if things are snappy and fast in dev then I wouldn’t have to worry about in a production build either; recently I’ve been using DataScript (not through fulcro, just direct React interop + querying datascript often); With that setup I ran into some significant perf. problems; so actually most of my performance problems were with DataScript and not the React re-rendering; I kinda solved it by putting an atom in front of DataScript to act as sort of a cache which I can do most of my query and logic out of so that I’m not going back to DataScript for every single data piece I need.

holyjak17:03:06

FYI https://fulcro-community.github.io/ is liveeeeeeeeeee! This site hosts rendered versions of the tutorials (including https://fulcro-community.github.io/guides/tutorial-minimalist-fulcro/index.html). Sorry for any broken links! Please help me check that it is OK and that the migration has not broken anything essential! If anyone was so inclined, I would very much appreciate help with improving https://docs.antora.org/antora/2.3/navigation/ and overall improvements to the look and feel of the site 🙏 (there is also a https://github.com/fulcro-community/fulcro-community.github.io/blob/master/todo.md)

👏 7
alex-eberts17:03:58

@U0522TWDA I can translate the eql tutorial into adoc today

😻 1
alex-eberts20:03:39

@U0522TWDA Converted the eql-pathom-overview from org to adoc and pushed to guides / tutorials: https://github.com/fulcro-community/guides/commit/4efdb1213098bc8416c4d32d1f3612b9d2d6bd7a 👍🙂

holyjak20:03:58

Awesome, thanks a lot!

holyjak10:03:25

BTW I have refactored in into the antora structure and fixed links.