Is it really? I’m using mithril with hyperscript and m-snippet to save some shift-typing and its native structure feels much better than html-like, especially when flow-control and multiple attributes kick in.

Wrt $subj, Lua has even better thing - Lua table, which can hold both kv-pairs and indexed items. With function environments that could allow something like:

  function comp:render()
    return div {
      class = "foo",
      input {
        type = "text",
        disabled = true,
        value = self.value,
      }
    }
  end

That’s what Lua was made for. Idk why I would “<choose><jsx></jsx></choose>” over “choose { lua }”.

> That’s what Lua was made for. Idk why I would “<choose><jsx></jsx></choose>” over “choose { lua }”.

React was made for web developers. Most web developers know HTML already. Many of them probably know Lua too, but not as widespread as HTML-knowledge.

JSX is basically HTML in JavaScript, so it's easy because it's familiar. The reason for JSX is to make DOM creation in JS more like DOM creation in HTML.

You need to invent and build non-trivial systems to compile JSX, while you only need a couple lines to make a mithril.js style hyperscript h() without the need for a compiler, and you get variables, loops / array maps etc for free since you're writing normal JS.

Sure, I'm not arguing for everyone to use JSX (I personally use Reagent/Hiccup in ClojureScript most of the time, which are just built-in vectors (arrays) basically).

I'm just explaining to someone why people chose JSX in favor of X, when they come from a HTML/CSS/JS background.

Yeah that's fair! Everyone has their own way to do stuff

In my opinion, HTML and XML would benefit from being a Lua table with Lua strings too.

My opinion is that most developers would be better off if they just started using lisp-like languages instead. Use Fennel if you really have to use Lua.

Lisps are much more loaded with implicitness around all sorts of brackets, which makes them non-friendly for semi-programmers. This is less important in our usual industry that is motivated to hide as much as possible behind a paywall, but I’m a strong follower of “anyone wielding a keyboard should be able to program” ideology.

That said, historically lisps are the most featureful runtime-wise. It’s a real shame we hide behind our complexity but collectively chicken out before really powerful concepts lisps introduced.

Awesome WM has nested GTK widgets similar to what you describe, a testament to the flexibility of Lua's uber table.

Because you’ll have to switch context each time you look into browser developer tools, MDN docs, etc.

Browsers have no support for JSX, nor is it documented at MDN.

Let me clarify: React team could choose any syntax of JSX, or even have no syntax and use nested data structures. They've chosen HTML-like syntax for developer convenience. My first experience with React was through ClojureScript and Om (back in 2014), and I can tell you that constantly translating back and forth between 2 vastly different syntaxes hurts.

Worse thing is that html snippets are not directly pasteable into your code. For this I wrote me html-to-m tool which I can run on a visual selection in vim with a hotkey. There is a web-based one, but I find its formatting too awful to use.

This has the downside of mixing properties/attrributes with children.

So, in `div`, `class` is a property, but `input` that immediately follows is a child of the component

Ironically, this is a case where one of Lua's most controversial features comes in handy. Tables can be initialized with both named and sequential members. In this case, "class" is a named member and the `input` element is sequential.

I think gp meant that they can be reordered in a way that is hard to reason about, e.g. {…many-children…, class=""}, putting attributes away from a tag.

Yup. That's what I'm thinking about.

It's a similar issue as CSS nesting, by the way :) I'm not saying it's inherently bad, it's just it could be confusing. But could probably solved by a linter: put attributes at the top, nested children at the bottom

How would that look in lua with a custom function or class instead of div, input, etc?

To me JSX and hyperscript are both about the same thing. JSX gets compiled to a bunch of createElement calls that looks just like hyperscript. I prefer the look of JSX over hyperscript.

The same way as in jsx

  div {…}
  Comp {…}
  Ns.Comp {…}

I’m loving using hyperscript in my projects.

Man that’s my least favorite thing about react :/

Is that because you want presentation to be separated? Or some other reason?