This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2017-05-30
Channels
- # arachne (2)
- # beginners (8)
- # boot (19)
- # chestnut (2)
- # cider (1)
- # clara (1)
- # cljs-dev (31)
- # cljsrn (82)
- # clojure (163)
- # clojure-dusseldorf (7)
- # clojure-greece (1)
- # clojure-italy (4)
- # clojure-norway (3)
- # clojure-russia (24)
- # clojure-sg (5)
- # clojure-spec (6)
- # clojure-uk (42)
- # clojurescript (239)
- # core-async (4)
- # cursive (10)
- # data-science (18)
- # datascript (1)
- # datomic (110)
- # emacs (16)
- # euroclojure (1)
- # events (1)
- # figwheel (1)
- # hoplon (22)
- # keechma (2)
- # klipse (5)
- # lein-figwheel (3)
- # leiningen (7)
- # luminus (27)
- # melbourne (2)
- # mount (5)
- # nyc (7)
- # off-topic (35)
- # om (20)
- # onyx (49)
- # pedestal (41)
- # re-frame (31)
- # reagent (18)
- # remote-jobs (9)
- # ring (4)
- # ring-swagger (1)
- # spacemacs (6)
- # specter (6)
- # uncomplicate (3)
- # unrepl (9)
- # untangled (54)
- # yada (11)
is there any examples on github of someone using cljsjs/vis ?
grounded_sage: I just use Github search when I wonder things like that. https://github.com/search?utf8=✓&q=%22cljsjs%2Fvis%22&type=Code
I did and there was very little I could find. Unfortunately it takes it as a partial string I think in the search.
I thought the results looked pretty good? These, for example: https://github.com/diegonc/rexster-explorer/blob/86da182fa01ff87d71f330168a9facd695da89b0/src/cljs/rexster_explorer/visualization.cljs https://github.com/bamboo/classloader-vis/blob/0248853c4da404ec47062bcd9e0f1b13cb176778/view/src/cljs/view/core.cljs
Errrr, so: not sure if this is a CLJS-in-general question or a figwheel-in-particular question. It goes: I’m working with Reagent. In my core.cljs I’ve defined an init!
method, marked with ^:export
. Observing examples around the wobs, I added a <script>
tag to my index.html — after pulling in my js bundle, call the init method.
When I work with figwheel, this works just great. When I stop using figwheel and serve it on my own http server, it no longer works. The JS bundle loads, but in the console I see <app name> is not defined
.
I have written an HTTP server that responds to every request by handing back the html template.
I updated the cljsjs.react-bootstrap package locally and installed it. But when I require it in my namespace, figwheel complains about the missing class. The dependency is listed and available. What could be the cause?
Hello everyone. I need to test some CLJS code that needs to run in a browser-like env (calls js/requestAnimationFrame
). I tried using doo
(through boot-cljs-test
), and Firefox launches but tests don't because ReferenceError: doo is not defined.
How do you test CLJS code that's specific to the browser ?
@djebbz hey, is that somehow related to scrum? 🙂
yes : scrum/dispatch-sync!
calls js/requestAnimationFrame
, so I can't test this code under node.js only.
I was trying to figure out how to pass another batched-update function, but didn't really find out.
it should be under :batched-updates
key
but the thing is that you can’t provide update cancelation function at the moment, I wanted to change that but never looked 😅
I don't want to cancel, just to avoid calling rFA so that I can test under node. What's this function signature ?
js/requestAnimationFrame(fn)
yes, but if I provide my own function instead, how should I implement it ? (fn [callback] (js/setTimeout callback 16))
?
I’d do it synchronously (fn [f] (f))
, sync code is easier to test
Does it mean that even if I use scrum/dispatch!
(async mode) the updates will always be synchronous with (fn [f] (f))
?
yes, sure
This should not be a problem since batching is just an optimization for rendering perf on the client
Somehow I have a behaviour of figwheel, which seems strange to me. While requiring cljsjs.react-bootstrap
in my namespace, cljsbuild compiles the files correctly. But figwheel complains about a missing namespace.
@danielgrosse Could you paste some more code to provide some context? How are you requiring the dependency and how are you using it?
I just test some reduced case
Updating to the latest Clojurescript Version solved the problem
Hi, how can I use webpack to process sass files in clojurescript projects? If I want to pack some home.scss
, how could I import/require this scss file in clojurescript for the use of webpack? Thanks!
@cmal You can not really hook Webpack loaders into ClojureScript modules, because cljs modules are not supported in Webpack.
Can I pack standalone css/scss files to a single css file with the whole magic sass-loader, post-css, autoprefixer provide?
@cmal https://github.com/thheller/shadow-cljs is work that @thheller is doing to bring cljs into the js tooling circus. i mention this because i’m merely aware, not because i use it. good luck 🙂
(i had the wrong link initially, sorry)
@robert-stuttaford Thank you.
@cmal, when you're talking about using scss in webpack, do you mean somehow including the css in a js bundle, or in a separate css file?
If the latter, you could just use whatever tooling you're used to, now?
@pesterhazy It is the latter. Can I use webpack to pack separate css files? I am used to use grunt but I used webpack in this project so I wonder whether webpack can do this, if the css files are separate from js or cljs files.
Not sure about the css part
I always thought that was what scss was for?
Does anyone happen to know how to register window "message" event with Google Closure? This works: (.addEventListener js/window "message" handle-message)
but this doesn't (events/listen js/window "message" handle-message)
The latter fires but the message's .-data
is nil
Thanks @pesterhazy
@cmal shadow-cljs
is sort of alpha but you can use it with webpack today if you like
https://github.com/minimal-xyz/minimal-cljs-webpack-hmr is an example using webpack + HMR + CLJS
the only issue with css is probably in the relative requires but besides that things should just work
@thheller May I ask you some basic questions? What is the cons if I use webpack to pack the app.js
generated by cljsbuild
? And what is the difference shadow-cljs made?
sure … usually CLJS (or Closure JS) code assumes there is one global shared scope but node.js or webpack assume there is one scope per file
so what shadow-cljs does is inject some additional code that sort of creates the global scope
while also making the files compatible with the usual require
that node or webpack expect (could also do ES6 style import
)
is the intro I wrote for JS devs which pretty much applies to any JS tool you may want to use
no cons really other than that you need to use webpack to bundle things since you don’t get a single app.js
Thank you for answering so much. Btw, https://github.com/thheller/shadow-devtools-example is 404 now.
something you can also do, if you want to work with webpack, is to generate two bundles, webpack-bundle.js and app-bundle.js
https://github.com/thheller/npm-module-example has some examples for the stuff
works out of the box with create-react-app
and create-react-native-app
or any other js tool
then configure webpack to have, as an entry point, a lib.js with window.React=require("react"); window.ReactDOM=require("react-tom");
and so forth
basically export multiple global vars from the webpack bundle. Clojurescript should work fine like that
if you want to be fancy you can concataneate the two bundles 🙂
Not quite understand before I checking the examples. But can I say it in this way: shadow-cljs
make it possible for JS developers to import CLJS to a working JS/webpack project?
short demo I made for create-react-app
…https://www.youtube.com/watch?v=BLDX5Twt2zk
still need to make the written guide cause there are some gotchas in the most recent create-react-app
and their file reloading
excellent work! I will dive into that. Thank you both. @pesterhazy @thheller
by the way, is there a way to make create-react-app spit out an actual webpack configuration?
When I saw it last, the webpack.config.js was hidden in some node module, I think
thanks ! 🙂
but after that you are basically on your own. no more create-react-app
updates will work
makes sense
yeah I guess that's sort of to be expected - if you get off the scaffolding, you can't hope that updates will still work
creact-react-app seems popular, so we might want to jump on that bandwagon
although a lot of it isn't applicable to cljs (redux, js util libs, ...)
but some things they do CLJS just doesn’t need so you’ll always need to work around some stuff I guess
@thheller > I think they are going to drop the zero-configuration bit at some point A side note: This wasn’t told in public, but create-react-app is basically a framework.
they just don’t promote it as a framework, but looks like keep moving in this direction
not saying that I want access to the full webpack.config.js
but adding a tiny adjustment to the ignored
in webpack would go a long way
well I’m working on adding the normal CLJS live-reload so it can work side-by-side with the webpack HMR
yeah, I have a feeling that this focus on zero-config without excuses doesn’t lead anywhere
scaffolding is always bitter-sweet
it was the same with rails
it allows you to defer learning about the details, but usually you still have to at some point
yeah I agree … same idea with shadow-cljs
.. the defaults should be good enough to get you into a working app with minimal work
If anyone is not aware, http://unpkg.com hosts all files in npm, which is amazing for prototyping
I have a dev (`:optimizations :none`) and a devcards build with each one having its own :output-to
/`:output-dir`. Both take roughly 2 mins. Now I consider shortcutting. Anyone been there before? Any advice?
@deas :parallel-build
might speed things up https://clojurescript.org/reference/compiler-options#parallel-build
@mfikes @qqq It's an 8 core box with 32GB, parallel build already enabled. Little app code, but a ton of libraries. Was considering to use one build for dev and devcards to at least cut things in half. However, it is a bit more tricky than expected due to the way devcards works.
@deas https://github.com/clojure/clojurescript/wiki/Compiler-Options#cache-analysis … 2min is absurd 😛
@theller "Experimental" ... :thinking_face: ... 2 mins (each) is really terrible. Verbosity seems at max already. Still no clue. Seems I'll have to look real close to figure out what's wrong.
@theller Looked at shadown-cljs a few days ago. Sometimes it's not so obvious which route to take with cljs.
@deas, there's something funky about your setup, and it's hard to tell without seeing the project.clj/build.boot or code
Try bisecting. Start with an empty project. If it's fast, add half your dependencies. Then add stuff bit by bit, noting the build times.
It's tedious but if you can't tell by just looking at the code, it may be a good approach.
@deas : I'm on a weak 8-core + 32GB, and mine hovers between 1sec - 2sec recompile for my optimizations :none; even on :optimizations :adanced, it only takes around 1 min
My guess is that there's something macro-heavy somewhere in your code or dependencies, but it's hard to tell.
@pesterhazy bisecting surely is a good approach. Was hoping to find something even quicker. Like bumping verbosity and being presented with the bottleneck. Or quickly adding profiling to the compiler.
@deas, doesn't lein clsbuild once print out the files one by one as it compiles the project?
you should be able to see which ones compile slowly
in my optimizations none compile, first time = 1 min, all incremental recompiles = 1-2 seconds
still, 2min sounds fishy, unless you're compiling hundreds of namespaces
@qqq @pesterhazy It's the initial compilation time I am complaining about. And indeed, I feel 2 mins is a bit too much.
@deas: in that case, I don't think it's too bad, my 2K LOC clj project , initial compile time, is 46 seconds
lines of code: 1704 macros: 2 opt none: 43.753 seconds opt advanced: 61.64 seconds 2mins sounds reasonable if yours is more complicated
I have 32GB RAM + vendor_id : AuthenticAMD cpu family : 21 model : 2 model name : AMD FX(tm)-8320 Eight-Core Processor
[:website] Build completed. (192 files, 66 compiled, 0 warnings, 15.62s)
fresh build for my work project
17k LOC here, non parallel fresh build with :none is exactly 20s. Dependencies are probably killing your performance
@qqq you should also make sure that your Java memory defaults are reasonable - for those machine specs those build times seem unreasonable
@rauh Guess you may be right wrt deps. Got quite a lot. Especially due to the fact that I am using react and friends from node modules. @qqq @pesterhazy
@dnolen: I added a export BOOT_JVM_OPTIONS='-Xmx8g -client' first buid time for opt none is still 19 seconds
I mean I would like it to be faster but we need to spend some time on serial compilation perf
my dependencies are:
[org.clojure/clojure "1.9.0-alpha14"]
[com.cognitect/transit-clj "0.8.297"]
[org.clojure/java.jdbc "0.7.0-alpha3"]
[org.postgresql/postgresql "9.4.1212.jre7"]
[ring/ring-core "1.6.0-RC1"]
[ring/ring-jetty-adapter "1.6.0-RC1"]
[cider/cider-nrepl "0.15.0-SNAPSHOT"]
[org.clojure/core.match "0.3.0-alpha4"]
[garden "1.3.2"]
[binaryage/oops "0.5.2"]
[org.martinklepsch/boot-garden "1.3.2-0"]
[org.clojure/clojurescript "1.9.473"]
[org.clojure/core.async "0.3.441"]
[org.clojure/core.match "0.3.0-alpha4"]
;; client debug
[binaryage/devtools "0.9.1"]
[powerlaces/boot-cljs-devtools "0.2.0" :scope "test"]
;; repl support
[com.cemerick/piggieback "0.2.1" :scope "test"]
[weasel "0.7.0" :scope "test"]
;; server
[ring-middleware-format "0.7.2"]
[com.cognitect/transit-cljs "0.8.239"]
[org.martinklepsch/boot-garden "1.3.2-0"]
[cljs-ajax "0.6.0"]
[binaryage/oops "0.5.2"]
[reagent "0.6.0"]
[org.clojure/core.match "0.3.0-alpha4"]
[ "0.3.2"]
@deas, if you can reduce your compile time, consider blogging about the experience
i have a half dozen cljs files, all roughly 20 LOC, no external deps. initial compile ~30+ secs, thereafter less than 1 sec. is that normal?
@mobileink Some part of that 1sec is probably overhead from Boot, and Cljs compiler is like 250-500ms
But yes, sounds normal
@mobileink :verbose
is a good way to see where all the time is being spent
thanks. 'nother question: how dependent is that on code size? if my files had kbs of source would it make a diff?
it’s important to separate what statistic the compiler reports and the total user time
@dnolen: cool - a goid thing to add to the readme of a lib that uses cljs! and when i say goid, i mean good, really good!
Does anyone happen to know (so I don't need to go do the experiment myself) what the size is of a "Hello World" advanced compilation clojurescript file after compiled to javascript?
Unless I messed up something, 19KB with just (js/console.log "Hello World")
, there seems to be some goog
stuff that doesn't get eliminated
I'm thinking about delivering a relatively simple cljs compiled-to-javascript file to an otherwise js project, and I just am trying to get a rough idea as to what that would add to the filesize.
in the past one marketing point was that ClojureScript output was consistently comparable to using jQuery
Oops, I was compiling with :pseudo-names true, :anon-fn-naming-policy :unmapped
, dropping these reduced the output size to 4.7KB
Using vectors (conj [1] 2)
, increases the size to 82KB (these numbers are without gzip)
(js/console.log "Hello world")
: 4.9KB, 2.0KB gzipped, (conj [1] 2)
: 82KB, 19KB gzipped
Is it accurate to say that any Clojure code that deals with trying/catching exceptions will have to be explicitly rewritten in Clojurescript since the exception classes do not align?
@puzzler I wrote a macro to avoid reader conditionals inside try-catch in cljc code: https://github.com/binaryage/env-config/blob/master/src/lib/env_config/impl/macros.clj https://github.com/binaryage/env-config/blob/1d9a2409dad78324ed7ab2984d2b40b081173936/src/lib/env_config/impl/coerce.cljc#L64-L68 not sure if it is a good idea, used it just in this tiny lib, where it allowed me to write cljc code without reader conditionals at all
hello, anyone know if it's possible to get a nREPL server running on a NodeJS self-host CLJS process easily?
or some kind of bridge that hosts a nREPL server but passes the forms to a remote clojure socket REPL? (since lumo can host socket REPLs)
AFAIK, nREPL server knows nothing about cljs, you would have to introduce piggieback or something similar, and that is quite complex
so you have a nREPL client and want to evaluate cljs forms in your self-host CLJS NodeJS project, right?
@qqq I’m afraid I cannot answer at this moment, I don’t fully understand the consequences of such setup, likely answer is “unrelated”
I believe “self-host” is the hard piece here. Normally nREPL+piggieback expects cljs compiler on “server” side and it evals compiled js code “remotely” in some javascript context.
I guess @akiroz wants all this action to happen in self-host context, maybe @mfikes could answer this.
I'm having some trouble getting :npm-deps
to work with figwheel. I have added :npm-deps {:left-pad "1.1.3"}
to my dev compiler options but when I try to require left-pad:
(ns apollo.core
(:require left-pad))
I get an error that left-pad.cljs cannot be found. I was following this blog post:
https://anmonteiro.com/2017/03/requiring-node-js-modules-from-clojurescript-namespaces/
Am I missing something?