zv / picodom

1kb Virtual DOM builder and patch function.

Picodom

Picodom is a 1kb Virtual DOM builder and patch algorithm.

Try it online

import { h, patch } from "picodom"

patch(
  document.body,
  null,
  null,
  h("button", {
    onclick: () => alert("Hello World")
  }, "Click Here")
)

Use Picodom to build your own view library and state management architecture.

Try it online

import { h, patch } from "picodom"

let element, oldNode

function render(newNode) {
  return (element = patch(
    document.body,
    element,
    oldNode,
    (oldNode = newNode)
  ))
}

function view(state) {
  return (
    <div>
      <h1>{state}</h1>
      <input
        oninput={e => render(view(e.target.value))}
        value={state}
        type="text"
      />
    </div>
  )
}

render(view("Hello Picodom!"))

Documentation

The documentation is located in the /docs directory.

License

Picodom is MIT licensed. See LICENSE.