JSX is no longer my friend

Re:JSX is no longer my friend by breck on Tuesday March 15, 2016 @05:16PM (#11293062)

I'm wondering what the advantages of JSX are now in a world with ES6 template strings?

This seems plenty easy to read and write and has the benefit that it's pure JS and doesn't need to be compiled during development:

  const listItem = item => `<li><a href="${item.link}">${item.name}</a></li>`
  const listComponent = items => `<ul>${items.map(listItem).join("")}</ul>`

[ Parent | on HN ]

Re:JSX is no longer my friend by vcarl on Tuesday March 15, 2016 @05:18PM (#11293087)

It was discussed a long time ago. Some googling found this very old link

http://facebook.github.io/jsx/#why-not-template-literals

[ Parent | on HN ]

Re:JSX is no longer my friend by breck on Tuesday March 15, 2016 @07:53PM (#11293955)

Thanks for the link! This makes my case stronger as their example for why not to use literals is weak. Box should be a component that takes param(s), not a var for a tag name.

[ Parent | on HN ]

Re:JSX is no longer my friend by mg74 on Tuesday March 15, 2016 @05:23PM (#11293126)

The compile is a huuuge plus. If you do a error in your template string (e.g. forget a '>'), you won't catch it until you run it in the browser. The JSX will complain loudly when compiled.

JSX >>>> ES6 template strings

[ Parent | on HN ]

Re:JSX is no longer my friend by breck on Tuesday March 15, 2016 @07:48PM (#11293926)

Ah. I guess html errors yes. If you add "use strict" you will catch js errors at compile time. Plus editor should provide autocomplete in template strings. I wonder if anyone has provided a highlighting package for highlighting html inside template strings.

[ Parent | on HN ]

Re:JSX is no longer my friend by lhorie on Tuesday March 15, 2016 @05:21PM (#11293110)

The difference is in when the code blows up if there's a typo. With JSX/hyperscript, it blows up with a syntax error at parse time; with strings, it blows up at runtime.

[ Parent | on HN ]