How does Hyper differ from Lit (https://lit.dev/)

[Artur-]

It seems like it uses :eventname="magicstring" for event handlers where Lit uses @eventname=${(e) => myhandler(e) which is standard javascript in a tagged template.

It seems like it uses :for as a directive

<tr :for="user of subset || users" key="${ user.id }">...

which seems to conflict with listening to a for event - if such is fired, where as Lit uses the standard javascript mapping way

  ${(this.subset || this.users).map(
          (user) => html`<tr>...

Similarly for if <div :if="subset && !subset[0] " compared to ${subset && !subset[0] ? html'<div>':''}

Lit also creates standard custom elements that can be used as any other tag in the page.

Where does Hyper shine over Lit?