4 ms·

I don't have any issue with the hypersrcipt library presented here. In fact I find it interesting that, this is more or less how React used to work many versio

I don't have any issue with the hypersrcipt library presented here. In fact I find it interesting that, this is more or less how React used to work many versions ago. All JSX tags mapped directly to functions and there was no such thing as React.createElement. In fact I was always a little sad that React made that change, it was such a natural mapping. I understand there are under the hood implementation advantages to the move, but having the option to do React.dom.ul(...) was kinda cool. That said I really don't find any of the authors arguments particularly persuasive. I work with many inexperienced JS devs and haven't seen them struggle with these issues in JSX. Not to discount the authors experiences, it just seems this article could have been more about highlighting the library, rather than creating highly contrived seeming examples of why JSX is bad. I also agree with some of the others, that the advantage of JSX mostly comes in working with designers and people more familiar with HTML than JS.

spicyj 11y ago
> React.dom.ul(...) was kinda cool React.DOM.ul() works as it always did. Even if we change that (since it's kinda silly to ship down a big list of tags that we don't otherwise need), you can also do var ul = React.createFactory('ul'); and then ul(). No big deal.
- staltz 11y ago
  It's not that simple, and hyperscript [A] is much more practical than createFactory [B]. [B] requires the first argument always to be props, so most of the time for empty props, people end up always giving `{}` or `null` as the first arg. In [A] they are optional. In JSX if you don't have props you don't need to provide any "empty props" object. In [A], children are always an array, while in [B] sometimes a single-child parent only accepts that child as last argument, instead of an array with one child. Otherwise it's a runtime error or warning. This special case treatment is only visible when using [B], but transparent when using JSX. In [A], the first (optional) argument can be a CSS selector to declare the classnames and id. In [B] you have to give it explicitly as props. All this indicates that while React supports a non-JSX workflow, [B] is way less practical than JSX, probably because Facebook itself uses JSX extensively, and supporting non-JSX workflow was an afterthought when releasing React to the public.

spicyj 11y ago

> React.dom.ul(...) was kinda cool React.DOM.ul() works as it always did. Even if we change that (since it's kinda silly to ship down a big list of tags that we don't otherwise need), you can also do var ul = React.createFactory('ul'); and then ul(). No big deal.

staltz 11y ago
It's not that simple, and hyperscript [A] is much more practical than createFactory [B]. [B] requires the first argument always to be props, so most of the time for empty props, people end up always giving `{}` or `null` as the first arg. In [A] they are optional. In JSX if you don't have props you don't need to provide any "empty props" object. In [A], children are always an array, while in [B] sometimes a single-child parent only accepts that child as last argument, instead of an array with one child. Otherwise it's a runtime error or warning. This special case treatment is only visible when using [B], but transparent when using JSX. In [A], the first (optional) argument can be a CSS selector to declare the classnames and id. In [B] you have to give it explicitly as props. All this indicates that while React supports a non-JSX workflow, [B] is way less practical than JSX, probably because Facebook itself uses JSX extensively, and supporting non-JSX workflow was an afterthought when releasing React to the public.