That hyperx onclick example [1] is really clever if I understand it correctly from a quick overview [2]. It stores a reference to the event using the template literals features (reading manually the interpolated arguments):

    html`<button onclick=${() => alert("Hi")}>Click</button>`

Not sure how it is attached then; from the syntax it can only be a traditional onclick="" event, however in the examples [3] [4] they are attached as an addEventListener() events. I'd have to dig deeper to understand it.

I've done something slightly similar in the past:

    dom.body.html = `<button ${evt.on.click(e => console.log(e))}>Click me</button>`;

However, for that syntax above I'm using two different tiny libraries I made while the author could combine both of them into one + virtual DOM. Great work there!

Honest question as the author seems the submitter, what are the target developers for your library? It seems (to me) that virtual dom + JSX is overkill for simple websites, while the big webapps seems to want the enterprise-backed React/Angular/Ember/Etc.

[1] https://github.com/hyperapp/hyperapp/blob/master/docs/hyperx...

[2] https://github.com/hyperapp/hyperapp/blob/master/src/app.js#...

[3] https://hyperapp.glitch.me/clicks

[4] https://hyperapp.glitch.me/slider