facebook / jsx

The JSX specification is a XML-like syntax extension to ECMAScript.
http://facebook.github.io/jsx/
1.96k stars 133 forks source link

Theoretical: Drop JSXText #8

Open syranide opened 10 years ago

syranide commented 10 years ago

Bear with me here :) JSX currently looks like this:

<div>
  {'Name of things:' + name} -- no one really does this
  Number of things: {count}
  <span>
    Some {cond ? children : null}
    {'Some newline\n'}
  </span>
</div>

What if it looked like:

<div>
  'Name of things: ' + name, -- it's now intuitive to concatenate
  'Number of things: ', count
  <span>
    'Some ', (cond ? children : null),
    'Some newline\n'
  </span>
</div>
  1. "Arbitrary" JSX white-space rules can be chucked out the window, it's JS-strings plain and simple.
  2. It's super easy to add and see explicit leading/tailing white-space, no weird encoded values or lazy hacks.
  3. It's super easy/intuitive to concatenate stringy content instead of lazily creating more children.
  4. It's JS through-and-through + JSX-elements, comments behave as you would expect.

I imagine that it would be possible to omit ,, if you would really want to.

I realize this would be a ginormous departure from the heavily HTML-based syntax we have currently. From a purely theoretical/technical perspective it makes perfect sense in my opinion, but the practical aspects are obviously very questionable. I don't expect anyone to embrace this, but I think it's an interesting thought.

ghost commented 9 years ago

Thank you for reporting this issue and appreciate your patience. We've notified the core team for an update on this issue. We're looking for a response within the next 30 days or the issue may be closed.

gajus commented 8 years ago

The equivalent (ignoring whitespace and newline) using template strings:

<div>
    `Name of things: ${name},
    Number of things: ${count}`
    <span>
        `Some ${cond ? children : null}`
    </span>
</div>
syranide commented 8 years ago

@gajus It's not equivalent though, you're including indentation and newlines.

gajus commented 8 years ago

@syranide You are correct. :+1: Nevertheless, I wanted to include a template string example for visual reference only.

Does indentation and newline matter here?

syranide commented 8 years ago

@gajus It ends up in the source code and also affects white-space: pre. I would also expect many to prefer

<span>`
  Foo
  Bar
`</span>

...over...

<span>
  `Foo
  Bar`
</span>

so those would also be affected by the leading and trailing whitespace.

gajus commented 8 years ago

The only case it would matter is white-space: pre. In that particular case you can just make an exception and use regular quotes.