JavaScript once had a JSX-like syntax called E4X • Hacker News Board

Re: JavaScript once had a JSX-like syntax called E4X

#11

Post by Touche » Sat, Mar 18, 2017, 5:05 PM UTC

ads1018 wrote: post #8

Would be nice to see JSX syntax become standardized. Clearly lots of people like it.

How would that work in practice, though? Using Babel JSX gets compiled to React.createElement('div', null, {}). You can configure babel to output something else if you use something other than React.

So what would a standardized JSX syntax output? It can't be document.createElement since that is a web API and not a generic JS API. So what would it do, exactly?

Re: JavaScript once had a JSX-like syntax called E4X

#12

Post by dkarapetyan » Sat, Mar 18, 2017, 5:12 PM UTC

Anyone remember Yahoo Pipes? I wrote some flows at some point and used E4X. It was fun.

Re: JavaScript once had a JSX-like syntax called E4X

#13

Post by hyperpape » Sat, Mar 18, 2017, 5:19 PM UTC

Touche wrote: post #11

ads1018 wrote: post #8

Would be nice to see JSX syntax become standardized. Clearly lots of people like it.

How would that work in practice, though? Using Babel JSX gets compiled to React.createElement('div', null, {}). You can configure babel to output something else if you use something other than React. So what would a standardized JSX syntax output? It can't be document.createElement since that is a web API and not a generic JS API. So what would it do, exactly?

Could you specify the dom nodes that would be created and leave the API that JSX desugars to/calls into in order to create them unspecified?

Re: JavaScript once had a JSX-like syntax called E4X

#14

Post by hyperpape » Sat, Mar 18, 2017, 5:21 PM UTC

nilved wrote: post #4

I wonder what made JSX seem like a good idea then.

The post explains a bunch of things that JSX does better. A heck of a lot of successful ideas look just like something that was tried before but without the one restriction that made that thing fail.

Re: JavaScript once had a JSX-like syntax called E4X

#15

Post by benjaminjackman » Sat, Mar 18, 2017, 5:22 PM UTC

Touche wrote: post #11

ads1018 wrote: post #8

Would be nice to see JSX syntax become standardized. Clearly lots of people like it.

How would that work in practice, though? Using Babel JSX gets compiled to React.createElement('div', null, {}). You can configure babel to output something else if you use something other than React. So what would a standardized JSX syntax output? It can't be document.createElement since that is a web API and not a generic JS API. So what would it do, exactly?

Perhaps providing a parser from something like the tagged template literals[1] from e.g. 'tag `string interpolation`' could be used. For ones lacking a tag, a specially named variable could be looked for (e.g. something like __xml_parser__ ) , it would be up to the program to set that global.

if would mean that jsx would look something like

    function helloEl() {return jsx  Hello ${name}! }

as opposed to

    function helloEl() {return  Hello {name}! }

It would be a bit different though in what is actually going on though. The top example would just desugar to

    jsx.div(`Hello ${name}`)

jsx would be looked up like any other variable. So you could just define it in global scope to point to ReactDOM

1: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...

Re: JavaScript once had a JSX-like syntax called E4X

#16

Post by TomatoTomato » Sat, Mar 18, 2017, 5:26 PM UTC

Touche wrote: post #11

ads1018 wrote: post #8

Would be nice to see JSX syntax become standardized. Clearly lots of people like it.

How would that work in practice, though? Using Babel JSX gets compiled to React.createElement('div', null, {}). You can configure babel to output something else if you use something other than React. So what would a standardized JSX syntax output? It can't be document.createElement since that is a web API and not a generic JS API. So what would it do, exactly?

Does syntax standardization have to necessarily equate to implantation standardization?

Re: JavaScript once had a JSX-like syntax called E4X

#17

Post by oomkiller » Sat, Mar 18, 2017, 5:37 PM UTC

If you've ever used Mirth[1] then you've used E4X, for better or worse (usually the latter). It's still used very heavily inside of the transformers, even though Mozilla deprecated it years ago.

[1] https://www.mirth.com/

Re: JavaScript once had a JSX-like syntax called E4X

#18

Post by tolmasky » Sat, Mar 18, 2017, 5:41 PM UTC

Touche wrote: post #11

ads1018 wrote: post #8

Would be nice to see JSX syntax become standardized. Clearly lots of people like it.

How would that work in practice, though? Using Babel JSX gets compiled to React.createElement('div', null, {}). You can configure babel to output something else if you use something other than React. So what would a standardized JSX syntax output? It can't be document.createElement since that is a web API and not a generic JS API. So what would it do, exactly?

I've written an in depth blog post on "generic jsx", which turns JSX into function bind/currying syntax that would work fine in any framework (or not framework at all, as we currently use it).

http://tolmasky.com/2016/03/24/generalizing-jsx/

We use this generic-jsx in DemoKit: https://github.com/runkitdev/demokit , and it's really cool because you can do fancy stuff like:

      // Curry your JSX tags!
      const wordmark = ;

      .... hello

Re: JavaScript once had a JSX-like syntax called E4X

#19

Post by Spivak » Sat, Mar 18, 2017, 5:43 PM UTC

TomatoTomato wrote: post #16

Touche wrote: post #11

Earlier quoted context omitted.

How would that work in practice, though? Using Babel JSX gets compiled to React.createElement('div', null, {}). You can configure babel to output something else if you use something other than React. So what would a standardized JSX syntax output? It can't be document.createElement since that is a web API and not a generic JS API. So what would it do, exactly?

Does syntax standardization have to necessarily equate to implantation standardization?

No, but the question is what would the syntax actually do? Would it be an extension/wrapper around document.createElement? Could you have custom parsers? What would it mean for React?

Re: JavaScript once had a JSX-like syntax called E4X

#20

Post by bshimmin » Sat, Mar 18, 2017, 5:47 PM UTC

Marazan wrote: post #6

E4X was part of Actionscript 3. It was very nice.

I always found it a little odd but quite pleasant - but I don't at all remember AS3's E4X having interpolation. Did I just never know about this feature (or have since forgotten - it's been, oh, half a decade at least since I've used ActionScript 3 in anger), or was it missing?