3 ms·
> I don't think that it is sound to incorporate a DSL that imitates html only approximately into a language. The beauty of JSX is that it's not HTML, it's much
by 90s_dev 1y ago
> I don't think that it is sound to incorporate a DSL that imitates html only approximately into a language.
The beauty of JSX is that it's not HTML, it's much more generic.
> And that's irrespectively of my view on jsx, the latter which I find non ergonomic and confusing.
You're in the very, very small minority here. JSX is very clear and intuitive and natural and ergonomic and lovely to most of us.
And I don't even like React!
Compare:
Without JSX: https://github.com/sdegutis/sys32.90s.dev/blob/26bcb088a3df63d1133e51b1f893bee338849424/site/apps/painter/painter.ts#L38-L77 https://github.com/sdegutis/sys32.90s.dev/blob/26bcb088a3df6...
With JSX: https://github.com/sdegutis/os.90s.dev/blob/cc7310633d9ab186982a4f7f30975c4344105c1b/site/fs/sys/apps/paint.app.tsx#L28-L63 https://github.com/sdegutis/os.90s.dev/blob/cc7310633d9ab186...
- aatd86 1y agoTo provide a quick feedback, I believe the 'without jsx' version could have been improved. One advantage it already has is that it doesn't need the repetition of /closing> elements. But it doesn't go far enough in terms of function composition to pass arguments. The signature (that resembles react.createElement I guess) is too cumbersome. That creates a succession of braces and comma which is unfortunate. Just to specify some object attributes. That could be easily a function Attr(). We have higher order functions easily in javascript. We should make use of it. That eliminates html looking jsx since we just use functions. That's less confusing than pseudo html syntax.
- 90s_dev 1y agoShow me what that code would look like if it was done better.
- aatd86 1y agoMaybe you could try with hyperscript syntax for react(which I've just found the existence of). https://github.com/hyperhype/hyperscript https://github.com/hyperhype/hyperscript https://github.com/mlmorg/react-hyperscript https://github.com/mlmorg/react-hyperscript which might be actually similar except for the dollar sign which adds some noise. But some of your prop/attr setting would be inner function/methods instead of being passed as an array. That would shorten some lines. > Show me what that code would look like if it was done better I'm definitely not going to try to provide an example if you do not offer the courtesy of a smaller representative example though. By the way, why is $(Label,...) not simply Label()? That could be a function.
- 90s_dev 1y agoEventually I got new Label() working, but Label() by itself isn't possible while keeping them as ES6 classes. After a while of managing commas, you just begin to long for JSX again. Hyperscript wouldn't solve that.