Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Ijk – Transforms arrays into virtual DOM trees

github.com

Post reply on HN
Print view View original

41–49 of 49 posts

Re: Ijk – Transforms arrays into virtual DOM trees

#41

Post by Sir_Cmpwn »

couchand wrote: post #40
wrren wrote: post #7

I like the syntax, but I have to say that I prefer JSX. The real advantage of JSX is that it's very similar to HTML and developers have been reading, mentally modeling and reasoning about HTML -> DOM translation for decades.

The real problem with JSX is that it's almost HTML, but not quite, so you constantly have to fight against your assumptions about how it should work. At least JS is really just JS, and developers have been reading, mentally modeling and reasoning about JS -> execution translation for decades.

JSX got closer to just HTML recently, now that you can specify HTML attributes in addition to DOM properties.

Re: Ijk – Transforms arrays into virtual DOM trees

#42

Post by lucideer »

lukejacksonn wrote: post #21
adius wrote: post #16

This synatx is called JsonML and I'm maintaining a stable and highly usable implementation: http://adriansieber.com/shaven

Cool implementation. What is JSON about it though? What made you decide to pass children before props?

> What is JSON about it though?

"JSON" originally stood for "JavaScript Object Notation" - the restrictions on double-quotes and unquoted keys are arbitrary extras on top of that concept, but otherwise JSONML is, technically, another JavaScript Object Notatation for Javascript that is also a Markup Language.

Admittedly, the use of the term JSON these days implies that your syntax will be parsable by a JSON parser, which JSONML might not be.

Re: Ijk – Transforms arrays into virtual DOM trees

#43

Post by spankalee »

couchand wrote: post #40
wrren wrote: post #7

I like the syntax, but I have to say that I prefer JSX. The real advantage of JSX is that it's very similar to HTML and developers have been reading, mentally modeling and reasoning about HTML -> DOM translation for decades.

The real problem with JSX is that it's almost HTML, but not quite, so you constantly have to fight against your assumptions about how it should work. At least JS is really just JS, and developers have been reading, mentally modeling and reasoning about JS -> execution translation for decades.

For an alternative to JSX that's actually real HTML, but also real JS and requires no compiler, checkout lit-html: https://github.com/Polymer/lit-html

It lets you write HTML templates as JS template literals:

    let post = (title, body) => html`
      ${title}
      ${body>`;
But unlike using innerHTML, it stamps DOM from elements, and only updates parts that change, actually doing less work than VDOMs.

Lots of editors have automatic support for inline HTML tagged with a tag named "html", so you'll get syntax highlighting in say, Atom. And VS Code has a plugin that adds intellisense.

Re: Ijk – Transforms arrays into virtual DOM trees

#45

Post by athenot »

I guess it would be useful for programmatically building the DOM tree. But for writing DOM fragments, pug[1] is also an option. I happen to like the clean-looking syntax. Transposing their example:

    body
      h1 Hello World
      input(type='range')
      input(onclick='console.log') Log event
      ul
        li 1
        li 2
        li 3
      unless false
        span Hidden
[1] https://pugjs.org/api/getting-started.html

Re: Ijk – Transforms arrays into virtual DOM trees

#46

Post by natbobc »

IgorPartola wrote: post #35
yoz-y wrote: post #18

Earlier quoted context omitted.

What is the link between the two? Markdown does not really look or works "like" HTML, it just happens to compile to it.

Again just being pedantic here. This thing doesn’t look or work like HTML, but it does happen to compile to it too. I find Markdown way easier to read than HTML, and I read both all day long. Maybe having two decades of experience reading HTML Zoe whatever isn’t enough to offset the superiority of this format? (No idea. I dislike JSX, and I don’t think this is actually more readable beyond cute little examples, but I…

All I can say is readability is subjective. Hiccup is used quite extensively with Clojure/ClojureScript. Clojure for HTML rendering and ClojureScript as an alternative to JSX for Reagent. For people that enjoy Lisps I think it's probably great, for people that don't maybe not so much.

I definitely like the lower density of text that an absence of end-tags provides.

Re: Ijk – Transforms arrays into virtual DOM trees

#47

Post by natbobc »

athenot wrote: post #45

I guess it would be useful for programmatically building the DOM tree. But for writing DOM fragments, pug[1] is also an option. I happen to like the clean-looking syntax. Transposing their example: body h1 Hello World input(type='range') input(onclick='console.log') Log event ul li 1 li 2 li 3 unless false span Hidden [1] https://pugjs.org/api/getting-started.html

Looks a lot like slim [1] or even it's grand-daddy HAML [2]

[1] http://slim-lang.com/ [2] http://haml.info/

Re: Ijk – Transforms arrays into virtual DOM trees

#49

Post by ricardobeat »

natbobc wrote: post #47
athenot wrote: post #45

I guess it would be useful for programmatically building the DOM tree. But for writing DOM fragments, pug[1] is also an option. I happen to like the clean-looking syntax. Transposing their example: body h1 Hello World input(type='range') input(onclick='console.log') Log event ul li 1 li 2 li 3 unless false span Hidden [1] https://pugjs.org/api/getting-started.html

Looks a lot like slim [1] or even it's grand-daddy HAML [2] [1] http://slim-lang.com/ [2] http://haml.info/

PUG used to be called 'Jade', and was basically HAML-for-nodejs.
Post reply on HN