Another approach is to invert the problem and use html web components - so declare new objects in html and separate the logic. That feels far more natural to me than an almost html (react) or some sort of dsl which shadows html mixing up logic, data and presentation - html is the one part of the web stack which is pretty much fit for purpose, why try to replace it?

See Polymer for an example of using this in current browsers:

https://www.polymer-project.org

The markup is just custom html elements separate from the behaviour (in js). e.g. a dialog:

https://elements.polymer-project.org/elements/paper-dialog?v...

    <paper-dialog>
      <h2>Header</h2>
      <paper-dialog-scrollable>
        Lorem ipsum...
      </paper-dialog-scrollable>
      <div class="buttons">
        <paper-button dialog-dismiss>Cancel</paper-button>
        <paper-button dialog-confirm>Accept</paper-button>
      </div>
    </paper-dialog>