Hacker News Reader

Comment by breck | Hacker News Reader

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>`

View on HN

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

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

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.

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

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.

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.

Reply on news.ycombinator.com