This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-05-24
Channels
- # adventofcode (11)
- # architecture (12)
- # beginners (132)
- # boot (19)
- # cider (26)
- # clojure (69)
- # clojure-dusseldorf (4)
- # clojure-gamedev (1)
- # clojure-italy (46)
- # clojure-nl (4)
- # clojure-serbia (1)
- # clojure-switzerland (2)
- # clojure-uk (91)
- # clojurescript (79)
- # css (4)
- # cursive (2)
- # datomic (16)
- # docs (9)
- # duct (20)
- # editors (94)
- # fulcro (15)
- # graphql (2)
- # hoplon (1)
- # instaparse (7)
- # jobs (3)
- # lein-figwheel (3)
- # leiningen (2)
- # lumo (40)
- # mount (35)
- # off-topic (19)
- # reagent (18)
- # reitit (1)
- # shadow-cljs (123)
- # specter (7)
- # sql (5)
- # test-check (4)
- # tools-deps (38)
- # vim (20)
- # yada (9)
Given this example from the Reagent readme:
(defn timer-component []
(let [seconds-elapsed (r/atom 0)]
(fn []
(js/setTimeout #(swap! seconds-elapsed inc) 1000)
[:div
"Seconds Elapsed: " @seconds-elapsed])))
...doesn't that create a setTimeout
that will be perpetually running? Perhaps they can even pile up after various rerenderings and cause a small memory leak.
Would resorting to create-class
the only alternative for implementing a component that knows how to clean up itself?you can use with-let
macro for cleanup: https://github.com/reagent-project/reagent/blob/master/docs/CreatingReagentComponents.md#appendix-b---with-let-macro
also callback in setTimeout
is called only once (I think you interchanged it with setInterval
).
do you get the same level of re-rendering efficiency by passing a reagent atom to a component that you do by initializing it in the function itself? Does it matter, and what is the common practice? To create the state in the parent-most component and pass it down, or keep it outside of the component and access it like any namespaced def?
@theeternalpulse think there are different schools of thought. Personally, I prefer passing in the one app-state ratom as an argument to the component as opposed to referencing a global def directly. It makes testing easier (and helps me sleep at night 😂). As for initializing a ratom in a component itself, I lean on cursors of the one app-state ratom rather than making one-off local ratoms for the component. Helps visibility when using tools like re-frisk.
if you pass the ratom itself into components, that fact by itself won't affect rerendering
think about this way: this ratom itself (an object with a certain memory location) won't change
so from the rerendering standpoint it doesn't matter if you pass it in as an argument or use a global var
re-frame uses a global var, and I think there's nothing wrong with that
to add to what @gadfly361 said, passing in the ratom explicitly is a matter of style, perceived "code hygiene" and convenience
I think it's a bit annoying to pass it around to every single component that uses state
I also don't care for testing UI code thoroughly so maybe I just have bad habits 🙂
yeah, that's a thing I hated in react
even with context, it's a mess, especially when people spread in properties so you really can't visually tell at certain levels what was passed in
I did like react's solution of centralizing that stuff