Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Theoretical: Drop JSXText #8

Open
syranide opened this issue Aug 29, 2014 · 6 comments
Open

Theoretical: Drop JSXText #8

syranide opened this issue Aug 29, 2014 · 6 comments
Labels
Proposal 2.0 Proposals considerable for JSX 2.0

Comments

@syranide
Copy link
Contributor

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
Copy link

ghost commented Aug 4, 2015

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
Copy link

gajus commented Sep 3, 2015

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
Copy link
Contributor Author

syranide commented Sep 3, 2015

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

@gajus
Copy link

gajus commented Sep 3, 2015

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

Does indentation and newline matter here?

@syranide
Copy link
Contributor Author

syranide commented Sep 3, 2015

@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
Copy link

gajus commented Sep 3, 2015

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Proposal 2.0 Proposals considerable for JSX 2.0
Projects
None yet
Development

No branches or pull requests

3 participants