Yeah, I really like the SICP material. It’s been quite inspiring to read through it (I’m not quite done though).

oh cool, I’m going to have to watch her video on Adapting Clojure to a CS Classroom.

Another nice book is How to Design Programs of Racket fame.

oh, one of the Realm of Racket authors, thanks… will check it out

Are there any clojurescript libraries that use vdom and web workers in a way that the UI thread is only given the smallest possible patch, and nothing else is done in the UI thread?

like here http://www.pocketjavascript.com/blog/2015/11/23/introducing-pokedex-org

If I understand correctly, this is something that will be in Angular 2

Wow, this Pokedex is so swell _

That blog post really is a pretty good example of why the browser is such a terrible platform for development. It’s 2015 and people are excited for multithread, using technology that’s been around for 5 years (?), but has hardly been adopted because of lacking browser support - .-

Mind you, I’m not saying we should not dev for the browser, rather than this is just one of of those things that’s kind of funny and sad at the same time

It’s not a terrible platform, it’s just several OK-ish ones which are almost compatible, which is somehow worse

webworkers are pretty cool actually, only problem is that there is no efficient way to share data between them and the page

so you can end up in scenarios where serializing/deserializing stuff actually takes longer than the actual computation

but transit makes that much less of the problem than edn

does react have the ability to split the diff/patch/apply? that would be interesting

Hmm, but there's transferable objects as well to use shared memory instead of copying, and it says you can transfer MessagePorts. This could probably serve to make it faster.

doesn't work for cljs types though

but the whole webworker thing falls apart as soon as you need anything from the dom anyways

eg. the position/height of a dom element

Yeah, that's true, but being able to run logic there still looks like it could work sensibly

yeah but it is kind of all or nothing for most apps

since the big atom architecture doesn't work so well if you need to split it

you can do it for a bunch of stuff though, just not UI related

But is a split along application logic / view logic really that bad of an idea?

Well, yeah, that's how I imagined would work

UI in the main thread, logic in a worker

there usually isn't much logic going on though

I mean if you really to expensive calculations in the client use webworker

but all of that happens on the server in my apps

the most expensive stuff usually is the react diff

or parsing response data from the server 😛

Fair point, I suppose

but as the pokedex stuff shows

you can get pretty far with totally different techniques

and OMG is javascript terrible 😛

this exports/require stuff is terrible

have they not heard of the closure compiler .. it is so much better

every time I look through a js project I appreciate CLJS so much more

ehh, it’s not so bad. I make my cash dollars from JS, and it’s a more fun and expressive language to work in than many. There are warts, but with a bit of practice you can code around them. Not sure what your problem with the require stuff is; I like that it’s just an expression, so it’s immediately clear what scope you’re using a package in, although that’s going away with ES6 imports

And only now with CLJS and elm and friends are we getting really workable options for compile-to-JS languages with radically different semantics

the issue I have with it is the code structure it produces

one file per function basically

https://github.com/nolanlawson/pokedex.org/blob/master/src/js/shared/monster/getMonsterDisplayName.js

I mean come on .. that is overkill

next up is one package per function

just put em all in one file

and let the compiler figure out which aren't used 😛

https://github.com/nolanlawson/pokedex.org/blob/master/src/js/shared/monster/getMonsterWeight.js

seriously ...

It’s a fair point - the benefit you get from closure is the dead code analysis, which is exceptionally good

require/commonjs stuff works better on the node side, in the browser it’s a somewhat leaky abstraction which gets you the warm glow of familiarity, plus everything on NPM that makes sense in a browser

which is handy

Well, normal libraries don't look like that, I think. Take a look at react for example - it has a more sane module structure; they build up a module object and export that.

it depends what you mean by normal

react does that as well, the functions are just longer and sometimes have "some" support functions

look at lodash nowadays, you have the standard package with all the functions, but there’s also a NPM entry for each individual function

Ok, that's anecdotal - that is, it's the first library with such granularity I've seen.

but not that extreme yes

d3 recently moved to this style as well

https://github.com/d3

one freaking project per "function" 😛

But what drives that then exactly?

it’s partly philosophical (there’s an ideologically commitment to Tiny Things in node) but partly due to the dumbness of compilers, as discussed

ie, you don’t want 30k of lodash just for _.compact

Hello

they can't do what closure does ... if you include a file you keep everything in it

regardless of whether you use it or not

so you want every file to be as small as possible

Well the philosophical part is taken to the extreme, but ok, I get the "can't shake them trees" part.

But well, wouldn't a better solution be to figure out how to tree shake stuff instead.

Instead of go full ideololo?

probably

granted writing closure js by hand is not fun either

but for the time being, we have stuff like this https://www.npmjs.com/package/methods

exactly what it says on the tin (tm)

module.exports = [
    'get',
    'post',
    'put',
    'head',
    'delete',
    'options',
    'trace',
    'copy',
    'lock',
    'mkcol',
    'move',
    'purge',
    'propfind',
    'proppatch',
    'unlock',
    'report',
    'mkactivity',
    'checkout',
    'merge',
    'm-search',
    'notify',
    'subscribe',
    'unsubscribe',
    'patch',
    'search',
    'connect'
  ];

wait, what

yep

the whole package is just an array of string constants?

That's crayzay '

it’s a transitive dependency of some important packages, you can see there

yeah js has some crazy code

well, in fairness, that list would only be written once in your application, so why should it be written more than once in the entire world? 😉

Hmm

But I don't get

I'm quite new to CLJ+CLJS development, and I've kind of run into a wall with regards to thought process

@trancehime: what problems you running into?

@tragiclifestories: You can require single files with require, so why separate packages?

@tragiclifestories: I'm stuck with trying to figure out a sane way to implement WebSockets using sente on immutant in order to create a sort of lobby system where I can keep track of users subscribed to a particular lobby

where would it go? I mean, you could put it in node stdlib somewhere, but what if I want a list of HTTP methods on the client with browserify/webpack etc

very few people require this directly, it’s just buried in express, request etc

I mean, the actual implementation part shouldn't be that difficult, but it's the whole logic and architecture behind it really

@trancehime: I’ve never worked with websockets so it’s a bit tough for me to go into specifics, but there’s some ideas floating around for the architecture stuff

@trancehime: how comfortable are you with Clojure? Because I have code for a presentation that does something really close to that (a chat with channels, but at the moment no join/part) I could link to

And then answer questions if it's unclear (which it probably will be, I'm not the greatest programmer ever)

@jaen Any references would be nice; I've pretty much been forced into using Clojure due to a work assignment/project, and deadline is real tight. I've already done and insane amount with the time I've been given, despite having only had about a few days of time allotted to refresh myself on it. So I'd say I

I'm fairly comfortable with it by now

you could have a look at this, another one of those post-flux/FRP ideas, should be nice and agnostic as to where your data is coming from https://github.com/Day8/re-frame

Yeah, I've actually read the re-frame README, a very interesting read. Unfortunately it's assuming your data is within the client-side using something like datascript

ah

forgot about that bit

I've managed to populate my data with AJAX calls and present it in Reagent, so that's not a real problem

er, rather my atoms

And not to mention, I have to handle email notifications too, and postal on the CLJ side really hasn't been helpful

At this point work is making me do full-stack all on my own in a language I've only just become comfortable in using haha

@trancehime: ok, so catch - https://gitlab.com/jaen/clj-cljs-presentation

@jaen thank you so much, I appreciate it

presentation.backend.async.core is the backend, presentation.backend.async.core is the frontend part of the async communications

presentation.backend.chat.core is next-to-none backend logic, presentation.frontend.chat.core is the chat reagent component

Now it's more complicated than strictly necessary, because I use transit for serialisation, take care of timestamps with clj-time/cljs-time and use component

So again, if something's unclear - shoot

@trancehime: actually re-frame doesn't assume datascript IIRC, it uses a single atom. But for something as simple as chat you could probably do without it.

@jaen: yeah, the examples just use a single atom but basically its explanations hinge on utilizing something like datascript or basically data which could be populated on client-side such as a single app-state ratom. But it just gave me some confusion as at the time I was reading it I had no idea how to process making AJAX calls and then rendering them in the render function. Now I know how to do it though haha

I guess this might be confusing at first.

When I first learned of re-frame instead of using it I actually re-implemented it by going through the readme and source and this let me understand how it works. But that's certainly the long way round.

If time was something I had, I would have taken time to study the intricacies behind it. Sadly I do not

I thought of it mainly because it seems like a websocket would be a good candidate for treating as a stream in the FRP kind of way

Yeah, hence the second sentence, I've noticed you're tight on schedule.

I'm actually behind on schedule because of problems that occurred in my past work that I had to fix urgently

So, as I understand it, basically when async is started, I don't have to care about how many potential channels or pages I'm going to be having, right?

Ok, basically what I do is sente has this taoensso.sente/start-chsk-router! function which takes two arguments - the receive channel you get out of taoensso.sente/make-channel-socket! and a function that will be called for your message.

They are in the async file for you to read, but basically what they do is they match on the sente message, :chsk/recv is a message that's received from the other side (so from client on server, from server on client)

And I have a multimethod that dispatches on the event, events are 2-tuples [:event-name payload] and I just act accordingly

In this table here you have described what the messages look like - https://github.com/ptaoussanis/sente#now-what

I now see my code is slightly confused as to how it dispatches on event type, you should be able to dispatch just on id in ev-msg (those sente short names are somewhat confusign).

And in the multimethod for event

I do whatever logic I need

If I get :chat/new-message I add the message to atom on the client side, I send it to other connected clients on server side. If I get :chat/new-channel I add new channel, and so on.

omg. So actually, through using ch-recv and chsk-send! I am basically just manipulating the data structures and then sending it (optionally broadcast it if I need to) to other connected clients.

Yes

You send with chsk-send! make-channel-socket! returns

And you don't need to use ch-recv directly, start-chsk-router! sets the event loop up for you.

But yes, that's fairly manual

thank you

Gonna think about this, I have to go home, but I will be back

^.^

Sure, if anything's unclear there - feel free to ask. It will also help me, since I want to present to people that cannot into Clojure at all at some point, so any remarks on what's confusing will be helpful.

i noticed you used component but does it matter much if I don't use it?

also i will try and see how does start-chsk-router work

No, you don't have to

Figured, just wanted to be sure

In fact, if you're pressed for time it's probably better you don't, it slows you down somehow for benefits you won't get in a small, throwaway app.

Oh, one thing that's important with sente

(-> bidi-handler
    ring-keyword-params/wrap-keyword-params
    ring-params/wrap-params)

Don't forget about those two middlewares around your ring handler

Otherwise sente won't work and you'll be scratching your head as to why for a good while.

I already wrap those middleware

So it's fine

Then good; it's needed for the default implementation of user-id-fn (you don't have to provide one, like I did)

I left it there because I cannibalised it from another project where the user-id depended on authentication, you have to provide user-id on your own in such cases

If your app doesn't need auth (you for example identify by usernames only) then no need to care about that.

incidentally i have used friend for auth using a custom workflow, yet i dont want to open a connection until after they authenticate

thats been making my head spin a little

Hah, friend.

I don't pretend to understand it at all.

I've use buddy instead, it's considerably simpler and more easily understandable.

Kind like the difference between devise and sorcery in Ruby.

haha

apt

ANyway, is it posible for me to control when does the ws connection get opened?

most examples i saw start async immediately

I saw a blog entry of someone wrapping the sente routes behind friend/authenticated but that seeemed really weird

Sure, it depends entirely on you when you call make-channel-socket!

In the project I've cannibalised that presentation code from

I have a one step of indirection more

I have a core.async channel that I can queue messages to send on and I connect when I want to.

And when I connect I just run a go-loop that takes the messages from the channel and sends them, when connection breaks/disconnects, I stop the go-loop.

But most of the time connection ASAP is what you do; you don't have to though, entirely up to you.

As for wrapping sente routes behinf friend/authenticated

Well

That needs a bit explanation on how sente works, but just a bit

It doesn't connect with ws immediately

it first connect with AJAX to handshake

And then if client supports it, it switches over to websocket, otherwise simulates it by (I think) long polling

user-id-fn for example gets run on the AJAX handshake request

So wrapping with friend/authenticated makes sense

It puts the authenticated user data into the request map

Which you can then access in user-id-fn

To use a user id that's unique to this user

(probably his DB record id)

hmm, right

now it makes sense

I've did it a bit differently, but I removed it from the presentation since it complicates things a little

Because I use JWT for authentication instead of cookies

I just decided I'll wrap all my messages to look like so {:payload actual-message :something-else i-need} and set user id that way

When user authenticates I return him the id he should now have, he disconnects and reconnects with it

This way I can avoid using cookies/session sente requires by default.

But if you already use them then no need to jump the hoops

But such wrapping is nifty if you for example generate uuid for each message and can attach metadata to which message it was a reply (if you need so).

Hopefully you can get friend to cooperate easily, otherwise switching to buddy might be easier.

my auth is working fine wihout ws at the moment

So it should hopefully just work if you wrap sente routes (not sure if both or only the handshake one) and base user id on things friend assoc'd into the request map.

Yeah I was just using the default for friend

omg, that debug message. {:top "kek"}

this page is not really useful https://github.com/clojure/clojurescript/wiki/Companies-Using-ClojureScript

is there a page which actually links to the app written in clojurescript?

@jaen, @thheller FYI, my experience with web workes and cljs: https://groups.google.com/d/msg/clojurescript/Iu8ePb8OZR4/MEaan9zGBwAJ

tenzing does not create a project.clj file?

@mike: tenzing uses boot. boot does not use project.clj

@martinklepsch: does cursive understand boot? I know it works with project.clj.

https://github.com/boot-clj/boot/wiki/For-Cursive-Users

thanks!

@martinklepsch: do I have to add the code to my ~/profile.boot (is this where the file is supposed to be?), and then regenerate the boot project all over again?

you can also add it to your local build.boot file but since you might have multple projects/other people not using cursive you most likely want to put it into profile.boot

sure, but after adding it to profile.boot, do I have to regenerate the boot project?

@mike: after you’ve added it you just need to run boot lein-generate once and then after you add additional dependencies

@mike: the lein-generate task derives a project.clj from your build.boot so Cursive can parse that.

cool. do I have to keep running boot lein-generate in the future to keep the two projects in sync?

yes, when you add dependencies you’ll need to re-run it

I'm working on creating a cljs-compatible js lib on cljsjs, and a clojars lib of my wrapper for that js lib (more details yesterday on this channel, 11:40am-1:30pm). Of those here who are familiar with either or both parts of that process, is there someone willing to be pestered with a bunch of noob questions about it?

@eggsyntax: sure

Cool, thanks @martinklepsch . I'll hit you up in PM.

There’s #C0E66E1H7 as well

Oooh, I didn't see that. I'll use that as well.

I do not find (.getElementById js/document "container") intuitive, why not (js/document :getElementById "container")?

After the ( there must be a 'verb'.

The most common type of verb is a function.

The dot denotes calling a method.

@mike Consider (macroexpand '(.getElementById js/document "container”)) which yields (. js/document getElementById "container”)

how about (js/document/getElementById ...)?

(js/document.getElementById "container")?

although the "root" must be a global object, doesn't work with locals

wait, (js/document.getElementById "container") works?

yep

why does everyone use the other approach?

it doesn't work in all cases like I said

sorry, missed that line.

. or .. are the safe choices

What does .. mean?

these are weird stuff for people, like me, coming from js land.

what is .?

is .getElementById a function?

. is a macro

I see, what mfikes wrote now makes sense.

somewhat similar to ->

only assumes property access

And the macro is a 'method' macro that grabs the method from the object that comes next. Is that the way it works?

(.getElementById js/document ..) is short for "get property getElementById of js/document and call it with ..."

is . specific to clojurescript?

no

http://clojure.org/java_interop#dot

is there a property concept in clojure?

pretty much the same applies for CLJS

so, is . in clojurescript for javacript interop?

yes

can clojurescript also interop with java?

no

clojure does that 😉

so anything that compiles to javascript must be written in pure clojure code?

@mike: The one odd exception is perhaps in Nashorn

well you can use any javascript, wherever that came from

the cljs compiler only compiles cljs

I mean, can I import any clojure library into clojurescript code and have that library compiled to javascript?

no

well maybe if it is .cljc code

but generally no

is clojurescript a strict subset of clojure?

if so, what is the main difference between the two?

https://github.com/clojure/clojurescript/wiki/Differences-from-Clojure

main difference is pretty simple

cljs targets js

clj target the jvm

with all the platform limitations that come from that

ClojureScript separates compile time from runtime a bit more than Clojure.

given that figwheel already autoloads new changes, is there a point of evaluating code in repl, as it happens in clojure?

I'm trying to understand why one would want to connect to nrepl and evaluate clojurescript code.

Hah… Bruce fundamentally challenged the idea of REPL with Figwheel, IMHO.

nice.

nah a REPL is still useful

why reload an entire file to eval one form

I can see some use cases, but figwheel removes a lot of them.

well, it all gets reloaded when the file is changed anyway ¯\(ツ)/¯

I think devcards was an even bigger innovation than just figwheel, personally

(in terms of getting rid of the repl in the equation)

I just created a new project using https://github.com/martinklepsch/tenzing , it requires boot-reload.

does boot-reload use figwheel, or devcards, or none?

it’s own thing, I would think. figwheel uses lein

Yeah, it does ~the same figwheel does, but is different codebase.

so where does devcards fit in here?

I think there are some thing that could be improved if they re-used figwheel code but don't really know what they are, since I didn't encounter any.

do I not need devcards when using boot?

This is really orthogonal

devcards isn’t really the same thing, it works with figwheel but doesn’t duplicate its functionality

https://github.com/bhauman/devcards

Yeah, figwheel is used only for convenience with devcards, so you can get your devcards reloaded on the fly; I imagine you can use devcards with boot as well, I just didn't have an occasion to try yet

oh, so it doesn't work with boot-reload?

people are using devcards + boot

https://github.com/hashrocket/boot_devcards_example/

I didn't say it doesn't, it's just I didn't see an example. And it looks like there is one, thanks.

there are some other examples as well

thank you.

is reagent a wrapper for a specific version of react, or can it be used with any react version? (sorry for x-post, #C0620C0C8 is mostly 💤 )

As long as it's < 0.14

oh.

that old?

@jaen 0.14 has been out for a fairly long time, does reagent normally lag behind this much?

I don't think anything in Clojurescript world uses 0.14 (but may be wrong)

7th of October is not that long of a time IMO

why is that?

And IIRC this release changes how React works somewhat, doesn't it?

But for exact reasons you would probably have to ask library maintainers

I know 0.14 has breaking changes.

Yeah, so possibly that

but it does not necessarily mean that when reagent is upgraded to 0.14, codes using reagent will need breaking changes.

I assume reaegnt tries to abstract it.

but I might be wrong.

Also when you're not using React directly I imagine changes to it are not as important as when you're writing React directly.

Like I said you'd have to ask reagent's maintainers, I can only speculate.

is (.-body js/document) excatly the same as (aget js/document "body")?

aget is supposedly for arrays only.

@mike document.body vs document["body"]

(. js/document -body)

😉

but no aget is for arrays

so, if I want to protect variable renaming from closure compiler advanced optimizer, I can use aget?

yes

cool.

no

not cool?

well yes, but use goog.object.get instead

(js/goog.object.get obj "stuff")

aget works though, just not recommended

I see.

maybe http://himera.herokuapp.com/synonym.html needs updating.

@mike: reagent started upgrade to 0.14 on 8 october ! https://github.com/reagent-project/reagent/commits/master?page=2 i guess the changes are somewhat more than trivial

great.

and there will be some breaking changes, though i don't think these will break any of my code https://github.com/reagent-project/reagent/commit/348ac4aaf86dd120d0aa254dc06c5efa5991ce22

ubuntu users here? How do I get started? Java problem pops up first. Which version do I take?

probably off topic 😄

Does anybody know how to extend Closure library classes with cljs? I am trying to use closure rich text editor and need to write a custom plugin. It would be nice to do it in cljs...

The code I would like to do should do something like this:

goog.editor.plugins.BasicTextFormatter = function() {
  goog.editor.Plugin.call(this);
};
goog.inherits(goog.editor.plugins.BasicTextFormatter, goog.editor.Plugin);


/** @override */
goog.editor.plugins.BasicTextFormatter.prototype.getTrogClassId = function() {
  return 'BTF';
};

@dreic: openjdk-8-jdk should be available in Ubuntu 15.10 and to install Oracle JDK 1.8 on older versions you can use this PPA: https://launchpad.net/~webupd8team/+archive/ubuntu/java

@juhoteperi: so openjdk is fine, too?

@dreic: Yes

ok, prefer that.

thanks

@nbdam: This might help a bit: https://gist.github.com/Deraen/8fede09ce77859004537

Despite the 99.99% I did find a typo in the quick start guide.

there are at least two '.' instead of ':' right before code sections

thanks @juhoteperi this looks like it will

just found this book with clojurescript exercises http://catcode.com/etudes-for-clojurescript/etudes-for-clojurescript.pdf

if some has a few minutes, i need some help getting data out of my channel ... in the cljs repl

simple-dash.core=> (def a (get-data))
#'simple-dash.core/a
simple-dash.core=> a
#object[cljs.core.async.impl.channels.ManyToManyChannel]

I tried (go (println (<! a)) which doesn't seem to work

@clojuregeek: if you have used enable-console-print! it's normal you don't see it in the repl I think

if you really want to interact directly with the future value in the REPL, I think your best shot is putting it in an atom.

yeah i don't see anything in the browser... ok i'll try putting in an atom

(go (.log js/console (<! a)))

Should print you in the browser console

hmm ... maybe the channel is returning null Uncaught Error: No protocol method ReadPort.take! defined for type undefined:

I don't think channels can return nils, unless they are closed that is

most likely a is undefined