Hyperscript Tagged Markup: JSX alternative using standard tagged templates
1–10 of 93 posts
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#2[deleted]
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#3This is a neat syntax, but it doesn’t seem at all typesafe (typesafety was the main benefit of JSX over the various string templates that came before it).
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#4[deleted]
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#5This is a neat syntax, but it doesn’t seem at all typesafe (typesafety was the main benefit of JSX over the various string templates that came before it).
> typesafety was the main benefit of JSX
Do you have a source for that?
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#6How is this different from lit-html?
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#7This is lovely for using React or Preact in Observable!
https://beta.observablehq.com/@mbostock/hello-htm
We have our own lit-html-inspired html tagged template literals that render directly to DOM, but it’s nice to see HTM’s improved support for function attributes (e.g., onclick), spread attributes, etc.
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#8This is a neat syntax, but it doesn’t seem at all typesafe (typesafety was the main benefit of JSX over the various string templates that came before it).
> typesafety was the main benefit of JSX Do you have a source for that?
I don't know if there is a primary source but it is one of the main benefits for me.
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#9How is this different from lit-html? https://github.com/Polymer/lit-html
HTM is React-compatible, and has all the React semantics: e.g. you can interpolate attributes (with ...${foo} instead of React's ...foo) and tag names (with instead of React's capitalization-dependent ).
In other words, HTM is a drop-in replacement for JSX that avoids the need for a compiler by using the corresponding language features. (At the cost of a few extra ${}s.)
lit-html and its ilk render directly to the DOM. They give similar developer ergonomics to React/JSX, but don't integrate with that ecosystem. They aren't a drop-in replacement for a JSX compiler within your React app; they're more of a competitor to the entire React paradigm.
Also of note is that, as a drop-in replacement, HTM is properties-first, like React/JSX. lit-html has you use different syntax for properties and for attributes.
Both are cool!
Re: Hyperscript Tagged Markup: JSX alternative using standard tagged templates
#10This is a neat syntax, but it doesn’t seem at all typesafe (typesafety was the main benefit of JSX over the various string templates that came before it).
> typesafety was the main benefit of JSX Do you have a source for that?
My opinion, not a fact.
Before JSX came out, there were tons of templating systems that let you embed HTMLish things in JS: Handlebars, Mustache, EJS, Pug, Angular templates.
JSX’s big innovation was taking the way XHP promoted HTML to first class syntax and applying it to JS. The big difference between that and the template systems that came before it is JSX is statically analyzable (by your type checker, or by other tools), which means you can scale it to FB scale.