VDOM - render

render.js

const render = (vNode) => {
  if (typeof vNode === 'string') {
    return document.createTextNode(vNode);
  }
  const { tagName, attrs, children } = vNode;
  const el = document.createElement(tagName);
  for (const [k, v] of Object.entries(attrs)) {
    if (/^on/.test(k)) {
      const eventType = k.replace(/^on/, '').toLowerCase();
      el.addEventListener(eventType, v);
    } else {
      el.setAttribute(k, v);
    }
  }
  for (const child of children) {
    el.appendChild(render(child));
  }
  
  render el;
}