2 years ago, we released a pretty complex project (real time updates, event sourcing, dozens of views, etc) using virtual-dom into production. 2 designers were with us and occasionally helped with the crafting of views, they never complained and weren't lost at all; they actually found it funny and enjoyed it.

"It's familiar good ol HTML" is marketing again.

The argument about underpowered templates being easier to optimize is true though (see svelte for another approach), but it doesn't seem to matter nowadays. Good luck finding an actual difference with a good virtual-dom lib (known for their GC demands) even on a low powered machine on a real app.

> JSX is HTML and JS (?)

"JSX is a preprocessor step that adds XML syntax to JavaScript." http://buildwithreact.com/tutorial/jsx

Whereas the templates in Glimmer are built on HTML. At the 10,000 ft view, my two cents: it looks easier to reason about what is going on with dynamic elements in the template via handlebars together with what is going with the html elements themselves in terms of rendering/appearance/css, as compared to the JSX syntax.

i'm less concerned with what "looks" easier than what's actually easier.

i just can't convince myself "it looks less scary" is worthy of the technical tradeoffs (for me, at the very least).

> "looks" easier

I should have been clearer and said: it actually is easier to reason about the html and the dynamic rendering with the approach Glimmer takes.

Only for someone who has never seen JSX, and for very simple cases. For anything that goes deeper you have to break the pre-made HTML conditionals and circumvent. For instance the horror an Angular uses goes through to loop an object with "pipes" which are now defined in separate files, whereas everyone else would use Object.keys and that's that. I often wonder, where are the actual benefits with templates, all i can see from using them are critical downsides.

Do this in a template for instance:

    import range from 'lodash/range'
    
    const Item = ({ number }) => <li>{number}</li>
    const App = () => (
        <ul>
            {range(0, 20, 5)
                .map(index => 
                    <Item number={index} />
                )
            }
        </ul>
    )

Templates can't even resolve <Item> because they don't know scope. The have no access to `range` either. Instead we're now hacking around with template registrations and injections. This results in a mess of functionality sprinkled all over the place for no good reason.