Fork me on GitHub
#clojurescript
<
2020-02-10
>
yedi01:02:16

whats the best way to print a JS object at a cljs repl

p-himik11:02:17

It won't work for most of JS objects that are not object? or array?.

teodorlu11:02:21

If you want to look inside JS objects, you might be interested in @thheller’s recent work on shadow-cljs Inspect: https://clojureverse.org/t/introducing-shadow-cljs-inspect/5012 Possibly overkill if you just need to "print some stuff", but the inspector will allow you to drill into the data structure you put into it.

lukasz15:02:39

Hi all. I'm working on a tiny app to test some ideas out and one of the features requires that there will be a number of components which need to be refreshed at a fixed interval (think showing multiple timers or refreshing charts from an analytics db). Obvious idea was to create components for each ticker and use setInterval internally to refresh the state. That comes with a set of drawbacks : I have to manage component lifecycle to stop the setInterval, there might be potentially a lot of them etc. So I inverted the whole problem and I have one global setInterval, transmitting "ticks" over a re-frame event/subscription. So the question is: am I shooting myself in the foot in some way I can't see yet? The only drawback is that I have a constant change to the app db going on, regardless if the components subscribed to the "tick" event are live or not. I'm not concerned with a super precise clock tick and all components have to be refreshed at the same interval

p-himik15:02:03

Will you use Reagent? Or something else?

lukasz15:02:02

Yeah, sorry - it's reagent + re-frame.

p-himik15:02:01

Reagent has a timer component implemented on its title page: https://reagent-project.github.io/

p-himik15:02:34

As an alternative, you can use something like https://juxt.pro/tick/docs/index.html#_atomic_clocks One issue - it probably won't trigger the re-render since that's not a Reagent atom. But there are ways to turn regular atoms into Reagent atoms - reagent.ratom/run! should be one of them.

lukasz15:02:59

Yep, I've seen it - that's a very simple usecase and it's been working out of the box just fine. I think my current approach is working, it's from what I've seen an approach taken in game engines where there's one source of the clock and everything else moves with that "tick". I'm just wondering if constantly updating the re-frame's app db is going to cause performance issues down the line

p-himik15:02:21

Depends on the clock resolution and on how you structure your subscriptions. If most of the work is done in level-2 subs, it's shouldn't be a huge problem. Another thing is that if you don't really consider the current time a part of your app's state, maybe you shouldn't put it in the DB.

p-himik15:02:17

E.g. "refreshing charts from an analytics db" sounds like you don't care about the clock at all - you care about the new values. These new values are part of the app's state. The frequency with which you poll the new data may not be.

lukasz15:02:14

The clock ticks at 1s interval right now, and some components do need the current time - although now that I think about it, I could slow down the tick to ~50s and it would still work (can't be exactly 60s because timers are not precise in the browser, and I'm refreshing data which uses 60s windows)

p-himik15:02:01

1s doesn't sound too bad.

lukasz15:02:53

Neat, good to know. Thanks for debugging this with me @U2FRKM4TW

👍 4
g7s16:02:38

What is the recommended way of doing XHR? I currently see two options https://github.com/r0man/cljs-http and https://github.com/JulianBirch/cljs-ajax

sova-soars-the-sora21:02:58

personally have been using cljs-ajax and it's great. although r0man also produces quality stuff. =)

dnolen16:02:29

Google Closure has a thing, you can also use whatever makes sense for the environment (JS Fetch etc.) Libs make things slightly more idiomatic which may be preferred

dakra20:02:37

Does anyone have any material-ui templates for reagent? I'm just starting to play with it and like the material-ui framework and all the functionality. Translating the jsx stuff to reagent (with shadowcljs) is pretty straight forward but even the "simple" dashboard is a bit or work (e.g. https://github.com/mui-org/material-ui/blob/master/docs/src/pages/getting-started/templates/dashboard/Dashboard.js) Has anyone "translated" them or somewhere else templates where I can just copy and paste snippets to get something "pretty" fast?

shaun-mahood21:02:09

You could see if https://github.com/arttuka/reagent-material-ui is helpful at all - I've not used it though so can't comment either way

dakra21:02:36

Thanks. But that looks more like a thin wrapper around material-ui. Imho working with npm modules got so much easier with shadowcljs. E.g. I don't mind importing/requireing from the "normal" npm module and then do [:> Grid ...] instead of [mui/Grid ...] which I could do with this lib.

shaun-mahood21:02:11

Makes sense - hope you can find what you're looking for!