Fork me on GitHub
#helix
<
2021-09-10
>
JonR19:09:13

Hey @lilactown, when you have a sec, could explain why I see re-renders due to helix/props often in the profiler? I'm wondering if I am doing something wrong or this is expected

JonR19:09:29

Also, related to our previous convo around hook tracing/debugging, I have realized that react has improved the hook tracing a bit. Reading up on the GH issues it seems that the first step is what we see now in the debugger where you can a hook index but no name yet...

JonR19:09:27

It's not too useful though since you often end up with many hooks, some of which call other hooks, etc...

lilactown19:09:37

are you using factory functions?

JonR19:09:02

I am not sure actually, I didn't make our defnc macro. Let me double check

lilactown19:09:16

how do you create an element out of a component?

lilactown19:09:27

($ foo) or (foo)?

JonR19:09:57

(defmacro defrc
  [type params & body]
  (let [[docstring params body] (if (string? params)
                                  [params (first body) (rest body)]
                                  [nil params body])

        ; Handle an optional map of options to toggle feature flags
        opts? (map? (first body))
        opts (if opts?
               (first body)
               {})
        body (if opts?
               (rest body)
               body)

        ;; feature flags to enable by default
        default-opts {:helix/features
                      {:fast-refresh true
                       :define-factory true}}]

    `(helix.core/defnc ~type ~@(when docstring [docstring]) ~params
       ; `merge` to allow consumers to override feature flags in special cases
       ~(merge default-opts opts)

       ; Wrap the body in html macro to convert hiccup to react components
       (sablono.core/html (do ~@body)))))

lilactown19:09:08

when you see re-renders due to helix/props it means that new props were passed in

lilactown19:09:29

the way that factory functions work is:

(foo {:foo "bar})
is equivalent to
(react/createElement foo #js {"helix/props" {:foo "bar"}})

JonR20:09:37

hmm... I'm seeing that on a component which has one prop and the data isn't changing...

lilactown20:09:07

react (and helix) will re-render your component anytime its parent is rendered by default

lilactown20:09:26

are you wrapping the component in helix.core/memo?

JonR20:09:18

no, I'm trying to heed the warnings of not over memoing unless needed. Maybe I need to though?

JonR20:09:35

The debugger says when re-render is due to the parent re-rendering and I'm not seeing that on most of these

lilactown20:09:28

if props are changing the someone must have changed it 😛

JonR20:09:31

I think that someone is me obviously 🙂

JonR20:09:30

Thanks for duckie ing

lilactown20:09:54

yeah i hope it helped