Trick for hot-reloading components
alexisvincent opened this issue · 3 comments
Since UIX switched to React.memo wrapping the components, hot reloading of components where props are the same stopped working. Here's a trick for getting that back in development. Didn't know where to leave this so an issue it is :)
(when ^boolean js/goog.DEBUG
(set! react/memo (fn [& [f]] f)))
I don't think this is true (not verified). When changed ns is evaluated all functions are redeclared, and when React encounters a new component it'll re-mount it. I think having Figwheel ^:after-load
hook that re-renders UI from the root is going to trigger this in React. This is a common practice in ClojureScript.
(ns ^:figwheel-hooks my.ns)
(defn ^:after-load render []
(uix.dom/render [app] js/root))
Added a note into readme https://github.com/roman01la/uix#figwheel
For what it's worth I ended up needing the originally mentioned trick when rendering components through multiple namespaces... Eg:
;; a.cljs
(ns a
(:require [b]))
(defn app []
[b/render])
(defn render []
(uix.dom/render [app] (js/document.getElementById "app")))
;; b.cljs
(ns b
(:require [c]))
(defn render []
[c/render])
;; c.cljs
(ns c)
(defn render []
[:p "Hello world"])
I needed the trick to get the application to re-render when c/render
was modified.