Hello, I’m using shadow-cljs to build a reagent + re-frame app. What should I call during development in the :after-load function so that all components would be re-rendered with the changes in the code? I have tried calling (r/render [main-view] (.getElementById js/document "app")) again in that function and reagent.core/force-update-all, but the changes don’t seem to appear in the browser. Sorry if it’s more of a reagent question.

hey. the issue isn't reagent its re-frame. I can't remember the exact name but something like (re-frame.core/clear-subscription-cache!) or so (in the after-load)

typically you just re-render everything via r/render

(defn ^:dev/after-load start
  []
  (r/render [app]
    (.getElementById js/document "app")))

(defn ^:export init
  []
  (router/start!)
  (rf/dispatch-sync [:initialise-db])
  (start))

Thank you. I’ll take a look in that function and return with my findings then 🙂

That didn’t seem to work 😕 Maybe I have done something wrong elsewhere.

@juholei look at the browser console. shadow-cljs tells you what it is doing. if all that looks in order your code might be doing stuff that can't be hot-reloaded properly

Yeah the after-load function gets called correctly with shadow-cljs and re-frame subscriptions and events get their changes loaded correctly, so I guess I have something wrong with my views somewhere.

if you keep references to potentially reloaded code in the state somewhere this can be the problem

Yeah it might be just that. I just noticed if I make changes to my front end routing related files (using reitit), then the changed views also update. And reitit puts a reference to the current view component to the app state, so seems like that may be the problem. Thanks for your help 🙂

Hey all, I am playing around with the :release portion of my shadow-cljs project and have noticed that the released artifacts are trying to connect to . I'm not sure why this is required and if not was wondering how to disable this, any ideas?

it looks like your build has the shadow-cljs development stuff included. are you sure you’re running your release code?

yeah that doesn't look like a development build

make sure you are loading the correct output files. by default those will be the same as your development files so you might have something cached if the server doesn't handle that properly

Okay, currently I am outputting the release'd files to a different location than the dev's, however, I can take a look at the caching, that might be the issue

and did you adjust your HTML to load those files?

you can easily tell if you are loading the actual release build by the size and number of requests made

That's a good point, I'll dig in there

Curiosity question: how does shadow implement hot reloading? It doesn't say what library it uses in the manual https://shadow-cljs.github.io/docs/UsersGuide.html#_hot_code_reload

@teawaterwire what do you mean by library? shadow-cljs handles the reloading stuff, no library used

as far as the reloading is concerned it is pretty trivial to do given that everything is evaled in the same scope and namespaced

so unlike regular JS we can manipulate that scope easily and just replace definitions on the fly

oh I see - sweet! Everybody's talking about figwheel but Shadow is actually doing hot reloading on its own as well 🙂

(sorry I was under the impression that Shadow used a library underneath - I was wrong 😄 )

most of the magic happens here

https://github.com/thheller/shadow-cljs/blob/master/src/main/shadow/cljs/devtools/client/env.cljs#L194-L233

would actually be much less code if it wasn't for all the async support

works a bit differently in figwheel but figwheel made the concept popular

interesting! So many goodies included in Shadow 🌟

Hi. Is there an example of smooth development workflow with service worker? Say I want to build main.js and service-worker.js. They should be independent: if service-worker.js recompiles main.js shouldn't reload and vice versa. If service-worker.js changes browser should be notified to run unregister/register code.

I typically recommend using something like https://developers.google.com/web/tools/workbox/ for service workers

don't feel like CLJS much to offer in that area since its 90% ugly js interop

Most simple thing like

{:main                  {:entries  [foo.core]}
 :service-worker {:entries  [foo.sw]
                              :depends-on #{:main}
                              :web-worker true}}

you can always trigger the sw reload from the REPL

service workers are kinda special so I would probably make a separate build for them

Thanks, I didn't think about repl

since they'll be responsible for loading your actual app code you can't really make them dependent on the app code