[org.clojure/clojurescript "1.9.562"]

I don't see node_modules in the directory but I saw it downloading the module when I ran lein figwheel

do you have a node_modules in any of the parent directories?

yeah looks like it installed to my home dir

if you need to keep that the way it is, you might be able to run npm init -y to generate a package.json in your project directory, then try again... though it'd be better to not nest directories that need their own npm dependencies

ah that did it thanks :thumbsup:

@tyler @rgdelato https://github.com/clojure/clojurescript-site/issues/80

^ just opened this

Thanks!

oops, sorry. meant that for the Om channel 😛

hey anybody here using D3? it drives me crazy... for example - how would I access scale.invert() - is there a static invert(scale) version of it somewhere? Or can anybody recommend a comparable but pure alternative for clojurescript/reagent?

@kaosko this will help https://github.com/Day8/re-frame/blob/master/docs/Using-Stateful-JS-Components.md There's references to various D3s approaches towards the end.

Hi, @thheller . I cloned the shadow-cljs project and lein install into my local repo, but the shadow-cljs --once seems not working, I also tried lein run -m shadow.cljs.devtools.cli/dev. What is the right step? Thanks.

10220 ± : shadow-cljs --once                                                                                             [5h13m] ✖ ✹ ✭
Could not find artifact thheller:shadow-devtools:jar:1.0.20170531 in central ()
Could not find artifact thheller:shadow-devtools:jar:1.0.20170531 in clojars ()
This could be due to a typo in :dependencies or network issues.
If you are behind a proxy, try setting the 'http_proxy' environment variable.
lein classpath generated successfully
shadow-cljs - using lein classpath
Exception in thread "main" java.lang.ExceptionInInitializerError
	at java.lang.Class.forName0(Native Method)
	at java.lang.Class.forName(Class.java:348)
	at clojure.lang.RT.classForName(RT.java:2168)

(defproject alpha "0.1.0-SNAPSHOT"

  :description "FIXME: write description"
  :url ""

  :dependencies [[org.clojure/clojure "1.9.0-alpha17"]
                 [org.clojure/clojurescript "1.9.542"]
                 [org.clojure/tools.cli "0.3.5"]
                 [org.clojure/tools.logging "0.3.1"]
                 [reagent "0.6.1" :exclusions [cljsjs/react cljsjs/react-dom]]
                 [reagent-utils "0.2.1"]
                 [re-frame "0.9.2"]  
                 [thheller/shadow-devtools "1.0.20170531"]
                 ]

  :min-lein-version "2.0.0"
  :source-paths ["src/cljs"]

  :dev
  {:source-paths ["src/cljs"]
   :dependencies [[thheller/shadow-devtools "1.0.20170531"]]}
  )

haha doh thheller/shadow-cljs not thheller/shadow-devtools sorry 😛

Ahh.. Thanks.

don’t need to actually run lein yourself, just stick with shadow-cljs

OK.

:thumbsup:

@cmal also bump CLJS to 1.9.562 .. there is one important fix in that release

Is there a way to inspect the contents of an npm distribution package? If I know the filename, I can use unpkg: https://unpkg.com/[email protected]/README.md

But what if I want a directory listing? I can't seem to find a way to see the packages - or even download package bundles for specific versions here: https://www.npmjs.com/package/reactstrap

Wait a minute, this works: https://unpkg.com/[email protected]/

@pesterhazy there is a “Browse Files” link on the right, see https://yarnpkg.com/en/package/reactstrap

but unpkg is prettier

ah nice! http://npmjs.com seems almost deliberately unhelpful

unpkg allows you to inspect arbitrary previous versions of the package as well, whereas I don't think http://yarnpkg.com does

dunno, I try to not look to closely at npm packages 😉

that's been my philosophy as well, but at some point you need to bite the bullet

I'm getting more and more convinced that the easiest way to use clojurescript today is to use the "double bundle" strategy, i.e. 1 webpack bundle with multiple global exports and 1 clojurescript bundle.

Especially when working with React, you'll eventually want access to those juicy prepackages components available as npm dependencies.

one significant downside of the double bundle is code splitting though

if you just want one single big file that is not an issue of course

but yes access to npm is important since cljsjs does not scale well

yeah and a lot of cljsjs dependencies are a bit buggy

and have harmful externs as well

yeah... w/r/t externs, I just use aget .. ahem .. goog.object/get, which is not too cumbersome for React components at least

externs are not that hard … just misunderstood

aget is annoying

can you explain how codesplitting works with cljs, and what advantages it brings?

I tried and failed and https://github.com/thheller/shadow-cljs/wiki/ClojureScript-for-the-browser

take my work project as an example: http://www.smartchecker.de/tarifvergleich/smartphone

if includes 3 JS files

all from one build

but other pages (ie. http://www.smartchecker.de/) do not include the other 2 files only the common file

that /assets/smartchecker/js/calc-foreign-CF6E1081CE98A4F91DAC14940B4E9F0F.js file is react+react-dom

since that changes muss less frequently the other code

interesting

seems like a pretty advanced optimization though

micro-optimization even

well … you can either have every page download 200KB JS and not use half of it

or just download the code you want 🙂

smartchecker feels really fast by the way

thx, it should be … I optimized a ton of it

no ads either.... chapeau

code-splitting is the latest JS hype I feel

I started shadow-build/shadow-cljs 3+ years ago since I think its super useful

yeah along with js modules

yeah but same idea in CLJS really

just split at the namespace level

Hi all! I'm developing a mobile app with re-natal. I need to draw a curved line chart, (and maybe animate it). what is the best API to do it? I saw d3 and ART, but d3 is most for the web.. I alsodiscovered Victory https://formidable.com/open-source/victory/docs/native and React-native-Chart https://github.com/tomauty/react-native-chart. What do you think? thanks 🙂

@pesterhazy @thheller The webpack bundle part might also help with compilation performance issues introduced by tons of npm-deps.

@deas can’t really compare the two .. one tries to make the code go through the closure compiler

which is always going to be slower but in theory provide better optimized code

but yeah webpack is an alternative for that which be way easier to get going

webpack is very quick too

hmm I think its quite slow actually

@thheller Got the suspicion that npm-deps can make things really slow. Especially when tons of deps come into play.

yes definitely … it is going to be painfully slow without heavy caching

@deas is :npm-deps working well for you or do you have to work around many issues?

@thheller Compiliation performance may be an issue. Will look into that in a second. Other than that, I am not using :npm-deps literally bc it does not yet play with modules which don't map to packages. Hence, I build up the dependencies vector myself.

ah ok

thheller, thanks for the work on shadow-cljs, very cool stuff. just wanted to hear your thoughts on consuming JS to include in the modules. is there a way to get the JS code included in the closure bundles?

@danvingo thanks. I have only implemented the part where the CLJS code is bundled together by webpack not the other way around yet

a guess the shorter way of saying it, is do you still use foreign-deps?

yes but not for much longer

the real issue is that I want code splitting to work

yea, i see. thanks for the info

but webpack works well for now. even if you don’t have any JS it can package CLJS code just fine

:advanced still works so no real downside other than webpack adding a little boilerplate code

so webpack builds your final bundles - including split modules?

is this using shadow-devtools?

all *my* builds have been shadow-cljs for years

the webpack stuff I’m not using yet in production no but might soon

i see, i haven't played with it yet, so i'll do that first and get a better sense of how all the pieces fit

but yes you can use webpack to create a bundle now, including code splitting

great, thanks for your help!

working on the documentation and examples to make things easier to understand

thanks, much appreciated

I really only struggle with the webpack configs, they are so different from the way the closure compiler handles splits

@thheller How come you are pushing things from the JS side? Personally, I'd be happy to see JS land "disappearing" when working with cljs.

@deas been thinking about it for a while, this was the final push I guess https://groups.google.com/d/msg/clojurescript/HNuYCfPRtQw/OGbMQWH9CQAJ

I didn’t want to deal with JS land at all .. just like you … but :foreign-libs doesn’t scale so something needed to be done

I was against :npm-deps when it was introduced and still am .. so exploring what the alternative would look like

Very interesting. Thanks for picking me up here. 🙂

I really want to be able to dump everything into the closure compiler and get nice optimized output

but given the state of the JS world that is probably going to take some time to work reliably

meanwhile other interesting things are happening in things like create-react-app that ship a service worker by default

CLJS isn’t well suited for writing these since they would be too big

Hehe, I am also closely paying attention what's happening around create-react(-native)-app. Guess that's what cljs has to compete with.

yeah I’m using it as the basis for all my experiments which is why shadow-cljs work with those with almost zero config

If we wan't to pitch cljs at react devs, we will have to look at the tooling facebook is coming up with.

https://www.youtube.com/watch?v=BLDX5Twt2zk

if you haven’t seen it … just drop in CLJS with zero config

but using things like reagent still requires config

working on a written guide

really the only reason reagent or others require config is due to :foreign-libs

anyone know of sample code for cljs + apple pencil (via mobile safari)? I have googled; but can not find such info.

Hi Guys, I have memory issues, I'm running out of memory doing (take 1000 (iterate update-state initial-state)), this is because state is pretty large. If i were to thin the iterates, by doing say, (take 100 (take-nth 10 (iterate update-state initial-state))) do I use 1/10 of the memory space? Or does it still store the whole 1000 iterations in memory and return every 10'th one

I have a macro which appends to file and clears the file initially when macro ns is loaded. So if I use the macro twice, build, it would write twice. Then when I build again it creates a replaces file's contents which is expected. But this doesn't work so during incremental compilation, because macro ns is loaded only once when process is started. Is it possible to achieve same behavior during incremental compilation?

One solution I can think of would be to setup global timeout to detect subsequent compilations. But that's super unsafe :)

@michaellindon what are you actually trying to accomplish?

do you need the 1000th only?

@roman01la stateful macros are a bit icky - there’s no good answer to a problem like that

@dnolen @michaellindon sent the above message to the wrong chat - he meant to send it to the clojure channel, and it's being discussed over there now.

@dnolen I’m doing co-located css which writes everything into a file after some processing via macro

Is there any reason that Scrum, Re-frame, etc. are tied to a particular component framework (rum & reagent), instead of being agnostic state managers which have a notification capability built in (with helpers for particular component frameworks)

@dominicm I can’t answer for Scrum or Re-frame, but I can answer for Keechma. The reason why Keechma is coupled to reagent is that I’m using reagent every day, and it’s just simpler to fully embrace the platform and use it’s advantages. Any other integration would take serious effort and you end with the lowest common denominator of features. I don’t think it would be too hard to integrate Rum and Keechma but until someone has a real need for it, it could be a wasted effort

@mihaelkonjevic What are the sorts of features you really need to take full advantage of? Isn't the gist of it that eventually you update a "super atom" & cause a re-mount (which diffs & so on)

for Keechma, it’s super atom and the fact that components are simple functions that can be partially applied (which I’m using to pass in the state to each component)

@mihaelkonjevic But I would think that should make it easy to use with rum, brutha, etc. ? (I'm probably not grasping the state passing!) In Rum you'd pass into the root component the resolved state & re-mount rum. Same for Brutha.

@dominicm you might be right, I’ll definitely take another look

@mihaelkonjevic I'd love to know if there's a really good technical reason for it. If you do come up with something, I'd really appreciate a note back. I feel like there's a slight trend of complecting [Particular React Library] to State management. Possibly because they cannot be untangled, but I'd love to know why 🙂

https://github.com/chpill/re-frankenstein is a fork of re-frame using rum

I think it’s mostly related to people building frameworks for themselves first, so it makes sense to integrate with the view layer that you use every day. But, it would be an interesting exercise to see how hard it is to integrate with a diff layer

I suspect so too.

@shaun-mahood I've seen! There's also https://github.com/Day8/re-frame/pull/107 / https://github.com/binaryage/pure-frame which is in a similar vein of attempting decoupling.

@roman01la As somebody who's gone down the rabbit hole of writing stateful macros: Avoid it all cost. Absolutely make the macros pure or you're gonna have a bad time. They should even be pure among Clojure compiler restarts. I solved the issue with writing some DB file that get's written on macro expansion and loaded from the file system once the macro namespace gets loaded the first time.

non-stateful-macros, lol, had not even considered them until now

@dnolen @captainlexington yes sorry about that, I sent to the wrong chat 😞 Feel free to chip in though David. My question is about memory and garbage collection. When I do (take 100 (take-nth 10 (iterate update-fn initial-state))) I do not need the iterates which are not divisible by 10, so I am wondering if those iterates are garbage collected incrementally as the iteration process, or whether first the 1000 iterates are performed and stored in memory, and then the unwanted iterates are garbage collected in one large batch after the iteration has completed

back in my common lisp days i wrote a macro that parsed c header files and defined ffi structs 😄

guess you guys would consider that a no-no

*procedes

@adamvh that sounds fine. Now if it had an internal state that modified its output based on other times it ran, that would be iffy.

oh yeah i don't think i ever did that

didn't bang on the headers at all

although now that i think about it i probably should have given it an internal state tbh

to only parse the headers if it hadn't already

and to just like read from some dump otherwise

@michaellindon there’s no real skipping involved here and we do not control GC

@michaellindon given the small size of N here, I suspect your state is really big

@dnolen I see, yes this is a computationally intensive machine learning application, sadly one which cannot be summarized by the final state. I need some in-between values. I do not have enough memory to store all 1000 iterates, yet I would have enough memory to store every 10th iterate. I figured (take 100 (take-nth 10 would be one way to achieve this, but it looks like I am still running out of memory. I feel like clojure is still constructing the full 1000 iterates in the background.

right because that’s just how it works

ok, thats good to know, thank you for clarifying

my suspicion is your memory issues are pretty much in update-fn itself

without being able to see behind that opaque thing hard to say if your algorithm is benefitting at all from structure sharing or if you have lazy sequence or other memory related issues elsewhere

I expect the state on each iteration to be different from the state on the previous iteration, so I don't think I can exploit any structural sharing of the datastructure sadly

it’s a typical user mistake to write code around lazy seqs deep in some algorithm and run out of memory

state is quite big

You could write a tail-recursive function that's like a reducer with a passed index that could calculate them in chunks of ten at a time

@captainlexington yeah I'm thinking this is probably the way to go

I usually hate writing code that has to take hardware limitations into account, but it sounds like you have no other choice

i don’t quite follow. it will construct 1000 states but it shouldn’t hold them all in memory, right?

Oh I forgot that Clojure doesn't have tail-recursion optimization

So you'd have to use recur

@michaellindon chrome support heap snapshots so you can easily find the issue

when you say run out of memory I mean state has to be really big, at least 2mb at each iteration

assuming your just gobbling 2gb of ram after 1000 steps

sounds unusual to me, but like I said hard to say without seeing behind update-fn

@wiseman yes assuming you’re not assigning the result to a def

@michaellindon ah right this is Clojure though the same basic principles apply

so my understanding is that as the iteration procedes, it stores all the iterates in memory, until it completes, at which point the unwanted iterates are presumably GC'd

is that right?

not quite we should rewind here

you will in fact compute all 1000 states here via iterate, but take 100 will only take 100 of them

sorry for being slow

ok right

got it

the ones that were skipped will be GCed whenever the VM decides to do that

im with you

@dnolen The issue is that he's running out of memory while the process is still running - so he wants to know whether the GC would have to wait until the take 100 was done before it could spring into action

exactly, and i think that is whats happening

I doubt it

take-nth uses drop

nothing will hold onto the dropped value

i would have expected that after the 9th state was used to compute the 10th state, that the 9th state gets GC'd?

hey guys… can someone who’s done enough CSS can tell me. I’ve been told to use BEM, now our elegantly looking Hiccup markup looks like an abomination. It just… doesn’t feel right… So, maybe there’s better way? I can’t use Garden, have to use SASS. do you think it really makes sense to use BEM in a Clojurescript project?

BEM?

it’s a css convention http://getbem.com/introduction/

@ag we have plenty of it at work, looks fine in Hiccup for me

yeah, but it feels it was created to simplify certain problems that seem to be less in React based apps. no?

it depends on how you manage styles: usual CSS (maybe with preprocessors) or css-in-js

the latter is at the very early stage

Garden is much more matured

although ain’t perfect, still way better IMO than any of known pre-processors

@ag I hugely prefer to use SASS over Garden. BEM is really useful. I'd read anything by Harry Roberts on the topic of css organization

Even if you don't use BEM, you should probably have -some- pattern for your CSS classnames. In a magical future, I'd love to see some CLJS library rip off CSS Modules and let us do something like:

(ns example.core
  (:require [app.css :as styles]))

(defn app-component []
  [:div {:class (styles/app)} "Hello there!"])

@michaellindon Could you combine your post-iteration step into your iteration? So that you don't need the whole result set?

@rgdelato I’m actually close to release cljs port of this js lib https://github.com/threepointone/glam

@rgdelato I have implemented something along these lines for reagent, this is how it looks https://github.com/retro/confeedence/blob/master/src/cljs/confeedence/ui/components/notifications.cljs#L6-L12

I've also ported over a variant of styled-components: https://github.com/rgdelato/styled-classnames

but I'd like for there to be a CSS classname auto-gen solution that -isn't- CSS-in-JS for people who aren't into that

this perfectly shows how there’s no standard for managing CSS 😄

@rgdelato this is probably what you want https://github.com/roman01la/cljss

Yeah I have one as well! 🙂