Let template syntax use single curly braces instead of double

[bomzj]

What problem does this feature solve?

Let's improve template syntax by using single curly braces like in Svelte/React instead of the "Mustache" syntax (double curly braces).

Current syntax

<h1>Hello {{ username }} !</h1>

What does the proposed API look like?

New syntax

<h1>Hello { username } !</h1>

Much cleaner, less chars, better DX!

[edison1105]

https://vuejs.org/api/options-rendering.html#render
use delimiters

[bomzj]

@edison1105 , The point of this discussion is to improve Vue out of the box in the future by changing defaults to single braces instead of Mustache, so newcomers can benefit right away as well as oldies.

[edison1105]

ok, I got it. But that would be a BIG-breaking change.

[y1n0]

And while we're at it, we should change the dynamic attributes to use curly braces instead of quotes.

The current state of affairs with JS expessions as quoted strings looks weird. It makes it difficult to write/interpolate actual strings inside of them, And it creates confusion on whether the attribute value string is going to be evaluated or left as is.