4 ms·

Rightio, that sort of explains their rationale. Although this doesn't really help: However, this would lead to further divergence. Tooling that is built ar

Rightio, that sort of explains their rationale. Although this doesn't really help: However, this would lead to further divergence. Tooling that is built around the assumptions imposed by template literals wouldn't work. It would undermine the meaning of template literals. It would be necessary to define how JSX behaves within the rest of the ECMAScript grammar within the template literal anyway. I'm not really what the problem is here. Template strings seem to have been put in ES6 partly to do what JSX does, so it seems very odd that anyone went to the lengths of defining a language extension rather than use them.

asolove 11y ago
As I understand it, the problem is that template strings evaluate to strings, whereas JSX evaluates to function calls creating a data structure. So render would produce a string, React would have to parse it back out of the XML syntax to figure out the structure of the data hidden in the string, and then make function calls. That's expensive. More importantly, how would you share data structures? `<Todos items=${someObject}>` would return a string with the string representation of someObject, but it wouldn't be the same object, have methods, etc.
- clessg 11y ago
  You could probably use a tagged template literal that would return an object representation of the given string. Tagged template literals don't have to return strings; jsx`<Todos items=${someObject}>` could return an Element object, for example.
  - madeofpalk 11y ago
    But the input is still a string? I think it's helpful to know that when you see JSX like this: <MixinComponent> <InnerComponent name='madeofpalk'/> </MixinComponent> JSX will convert that into regular JS which will look like element('MixinComponent', {}, element('InnerComponent', {name: 'madeofpalk'}) ) Parsing that string during runtime to produce the above data structure isn't ideal.
    - clessg 11y ago
      Right, for sure. Template literals are not a good replacement for JSX.

asolove 11y ago

As I understand it, the problem is that template strings evaluate to strings, whereas JSX evaluates to function calls creating a data structure. So render would produce a string, React would have to parse it back out of the XML syntax to figure out the structure of the data hidden in the string, and then make function calls. That's expensive. More importantly, how would you share data structures? `<Todos items=${someObject}>` would return a string with the string representation of someObject, but it wouldn't be the same object, have methods, etc.

clessg 11y ago
You could probably use a tagged template literal that would return an object representation of the given string. Tagged template literals don't have to return strings; jsx`<Todos items=${someObject}>` could return an Element object, for example.
- madeofpalk 11y ago
  But the input is still a string? I think it's helpful to know that when you see JSX like this: <MixinComponent> <InnerComponent name='madeofpalk'/> </MixinComponent> JSX will convert that into regular JS which will look like element('MixinComponent', {}, element('InnerComponent', {name: 'madeofpalk'}) ) Parsing that string during runtime to produce the above data structure isn't ideal.
  - clessg 11y ago
    Right, for sure. Template literals are not a good replacement for JSX.