VanJS comes with some flavours, thanks to Eckehard and Olivier Monnier
The 'DML' flavour from Eckehard VanDML and the 'HTM' suggested by Olivier.
Here is the example presented by Olivier :
import htm from 'https://unpkg.com/htm?module' import van from "./van-0.11.10.min.js" function h(type, props, ...children) { const tag = van.tags[type] if (props) return tag(props, ...children) return tag(...children) } const html = htm.bind(h) const counter = van.state(0) const app = html`<div> ❤️ ${counter} <button onclick="${() => ++counter.val}">👍</button> <button onclick="${() => --counter.val}">👎</button> </div>` document.body.appendChild(app) You can play with it here VanHTM
Notes than you can mix the flavours, feel free :-)
import htm from 'https://unpkg.com/htm?module' import van from "./van.js" const { div, button } = van.tags function h(type, props, ...children) { const tag = van.tags[type] if (props) return tag(props, ...children) return tag(...children) } const html = htm.bind(h) const counter = van.state(0) function Incer() { return button({onclick:() => ++counter.val}, '👍') } function Decer() { return button({onclick:() => --counter.val}, '👎') } const app = html` <div> ${div({onclick:() => alert(counter.val)}, '❤️', counter)} ${Incer()} ${Decer()} </div>` document.body.appendChild(app) 
Top comments (0)