This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-08-31
Channels
- # announcements (3)
- # beginners (139)
- # boot (28)
- # cider (40)
- # cljdoc (1)
- # cljs-dev (30)
- # clojure (61)
- # clojure-conj (1)
- # clojure-dev (113)
- # clojure-germany (4)
- # clojure-italy (29)
- # clojure-nl (3)
- # clojure-russia (2)
- # clojure-spec (38)
- # clojure-uk (53)
- # clojurescript (188)
- # core-async (4)
- # css (2)
- # cursive (7)
- # data-science (5)
- # datomic (14)
- # emacs (1)
- # figwheel-main (192)
- # fulcro (37)
- # jobs-discuss (1)
- # mount (4)
- # off-topic (47)
- # pedestal (7)
- # portkey (14)
- # re-frame (4)
- # reagent (22)
- # reitit (2)
- # remote-jobs (1)
- # ring (6)
- # shadow-cljs (65)
- # spacemacs (7)
- # specter (6)
- # yada (8)
@veddha.riady I dunno exactly, but you might find something over garden docs, in the end fulcro uses garden to compile the CSS: https://github.com/noprompt/garden/wiki/Syntax
so I was under the impression that fulcro did not re-render from root but instead only re-render changed idents. was I wrong or am I doing something wrong?
@thheller it does targeted updates, but how much may vary, I didn't checked closely, but the main idea is that re-render is governed by follow-up reads (or refresh
in terms of mutations), so all the components with the same ident will refresh, but also any components that contains the attributes mentioned in the follow up read (and in case of loads fulcro automatically adds some things there)
that said, there were changes that are less optimal than before since 2.6.0, so if you notice some weird root render that could be a bug
@thheller think there is also the rendering modes part. Think the fulcro lein template now has :keyframe
added as default. http://book.fulcrologic.com/#_rendering_modes
If I have a presentational component (for fulcro, one that does not use defsc
, ie. does not have a query
or ident
, purely presentation) I can use a regular function to emit the DOM I need. However, if I need the presentational component to use a callback / computed, do I need to necessarily use a stateful defsc
component to pass in the computed?
@pvillegas12 if you are not using query, don't mind computed, just send everything in props
got it, so the computed
is for a stateful component for rendering optimization?
regarding my earlier question about rendering from root: I made a small demo repo showing that render always happens from root and I want to find out why or how to optimize it? any feedback/suggestions are welcome https://github.com/thheller/fulcro-questions/issues/1
@thheller how can you tell it’s rendering everything from root?
https://github.com/thheller/fulcro-questions/blob/master/src/main/fq/parent_render.cljs#L49 its logging
@thheller I’m not sure that the console statement means its re-rendering the root
its the render
fn of the component so what else would it mean? (it is absolutely possible that my assumptions are incorrect)
rendering is usually not the most costly operation, computing the data for it is (`db->tree`), I think it's worth the investigation anyway, I myself use a project that can suffer if things are not optimized (quite large app)
I'm glad you are bringing it out, this is an important part I didn't had the time to inspect close and see if the opt is working as its supposed to, @tony.kay did some changes on 2.6, in prod I'm not having performance issues, but that doesn't mean it's optimal 🙂
@thheller just curious, why you changed the :root-render
in the example?
ah. can take it out. in my UI app I'm not using fulcro.client.dom
so the default js/ReactDOM
doesn't exist
gotcha
I have one tip for your mutations
here: https://github.com/thheller/fulcro-questions/blob/master/src/main/fq/parent_render.cljs#L20
you can instead write:
(defmutation set-name [{:keys [id name] :as params}]
(action [{:keys [state ref] :as env}]
(js/console.log ::set-name params)
(swap! state update-in ref assoc ::name name)
))
in the tx env you have the ref
, which is the ident of the component that triggered the mutation
this way you can always target the correct data point in the app db, making your mutations more generic
then you can do something like this from Fulcro incubator: https://github.com/fulcrologic/fulcro-incubator/blob/develop/src/fulcro/incubator/db_helpers.cljc#L32-L34
then the mutation would be: (db.h/swap-entity! env assoc ::name name)
@thheller interestingly enough, doing :shouldComponentUpdate (fn [_ _] false)
on Root
will not update the children (the name does not change)
With React, if children’s props change, even if the parent does not update, the children will re-render