Live data from Hacker News

Faster, Better DOM manipulation with Dommy and ClojureScript

blog.getprismatic.com

21–30 of 51 posts

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#21
post #2

Author here. Happy to answer any questions/concerns.

How mature is ClojureScript these days? I remember people saying it and Clojure on Android was rough when I was exploring Clojure a while back. Does the compiler eliminate unused code from the final output?

I'm led to believe the issues with Clojure (and other JVM languages) on Android are due to Dalvik not being as friendly to other languages as the Sun JVM. I don't blame Google, but it's unfortunate.

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#22
Interesting, but I'm not sure how appropriate it is to be comparing it to jQuery in such a head-to-head fashion such as by saying "15x slower", etc. Does Dommy offer the same features (including the browser support) that jQuery does? If not, then you're just comparing apples to oranges, and it doesn't sound like it does (or even plans to) on account that it sounds like there are design decisions that separate the two with regards to the published API ("Inspired by jQuery, but adapted to be functional in order to better fit with ClojureScript core").

Also, wouldn't it be more accurate for the selector testing to actually test against Sizzle[1]?

Other features aren't even present in jQuery, such as templating, and so I'm not sure why you'd even compare that. Yes people can and do use templates with jQuery, but that's an implementation detail and is not a concern of the library itself; jQuery does not coerce or force you to use a slow templating system, and most any good templating system will also have a compilation step that is run at build-time. So yeah, you can take some ugly userland jQuery example code and make specific code that is faster..

1. https://github.com/jquery/sizzle

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#23
post #2

Author here. Happy to answer any questions/concerns.

does Dommy provide a pure API on top of the DOM? (e.g., lens based) I don't immediately understand how one would make that performant given that the DOM is a mutable data structure. edit: WebFUI[1] is one clojurescript project trying to provide a pure interface for dom manipulation; there are others. [1] https://github.com/drcode/webfui

> I don't immediately understand how one would make that performant given that the DOM is a mutable data structure.

As a general rule, mutable API's tend to outperform immutable ones.

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#24
post #19
post #10

This is super impressive. I'm going to use this for my frontend work now. On a side note, what's the idiomatic structure, or "design pattern" for cljs front end code? I would assume something based on MVC, with models comprising of atoms with watches, Views consisting of hiccup templates and controllers gluing dom events to models and views. Am I close?

We internally have a nice component/widget abstraction we use which is not quite MVC, but we think cleans up a lot of web development. We will release in the near future once we perfect it.

Cool! I am wondering if you have worked with other frameworks like Pedestal.io, C2, or WebFUI, Ganelon. Or any others. What do you think of them?

I am just getting started with Clojure/CS and am evaluating the different options.

http://pedestal.io/ http://keminglabs.com/c2/ https://github.com/drcode/webfui http://ganelon.tomeklipski.com/

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#25
post #10

This is super impressive. I'm going to use this for my frontend work now. On a side note, what's the idiomatic structure, or "design pattern" for cljs front end code? I would assume something based on MVC, with models comprising of atoms with watches, Views consisting of hiccup templates and controllers gluing dom events to models and views. Am I close?

At Relevance we've released a "framework" for this; it's not MVC, but it addresses the same concerns. It's still in an alpha/beta state, but you should check it out if this stuff interests you: http://pedestal.io/

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#26
post #2

Author here. Happy to answer any questions/concerns.

Did the speedup of script execution have other costs? One would imagine that using Clojurescript would incur some other costs somewhere. This feels like a free lunch somehow.

It's incompatible with standard Javascript libraries, which is why you would use Dommy because you can't use jQuery. The ClojureScript compiler is also fairly slow (due to google closure compiler I think) so even with a running jvm it takes several seconds to compile small example files. To slow for me so I switched back to CoffeScript which is lightning fast.

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#27

Earlier quoted context omitted.

Wait so does sweet.js support arbitrary JS execution in macros now?

Not yet, but it's theoretically possibly with all the groundwork that's already been done. See https://github.com/mozilla/sweet.js/issues/12 So I should have said syntax-rules (for now). My bad!

Seems like you would still need to provide something like syntax objects and a special API to manipulate them?

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#28
>> Again the time saving comes from macros moving the work of parsing the template data structures from runtime to compile-time and directly generating efficient JavaScript.

If it ends being javascript string in the ends, how is it 7x faster (or whatever number)? I mean, sure the compiler could optimize a part of my code, but other javascript compiler could do it to.. right?

Although I find the Clojure example very sexy, I don't like how the examples tries to compare to contrived Javascript. I.e. I've been coding javascript for a couple years and I've never used jQuery "sort/filter/slice". But more importantly, it uses pre-defined function in Dommy but not in javascript. For instance:

  (->> (sel [:ul.my-list :li])
     (sort-by #(-> % (sel :input.last-name) .-value))
This uses sort-by where there's:

  function(a, b) {
    return (
        $(a).find('input.last-name').val()
      .localeCompare(
        $(b).find('input.last-name').val()
      )
    );
in Javascript.. Obviously, I can say:

  $('ul.my-list li').sortBy(function(x) { return x.attr('last-name'); }
My point isn't that much that jQuery is longer/shorter, but mostly that if two examples in two different languages are to be compared, it makes sense to use the same function.. where in this case sort-by is a high-level sort.

>> One is the loneliest number

It's not just "1" or "more than one", it's also zero. Iterating on a list makes it such that you can freely think in a high-level way about the operation and not about the exceptional cases. I.e. $('.blabla').hide(); It Just Works.

>> (mapv #(add-class! % :first-ten-adults)))

Yes, of course you can use map.. but using $('..').addClass('first-ten-adults') makes it so much easier to deal with, instead of knowing what works on one object, what works on multiple objects, what will throw an error if there's nothing, etc.

Meh.

I think Dommy is a great library but the author didn't do a great job at explaining why it rocks. I guess attacking a very popular language with its most popular library doesn't help :p

Re: Faster, Better DOM manipulation with Dommy and ClojureScript

#30
I'd love to use Clojure and clojurescript to replace js/ruby. It's a shame I never come across consulting gigs that use it. Or know any local clojure devs, so I'm still wary of using it on my own projects.

So it continues to only be the ideal choice for pet projects.

Post reply on HN