virtual-dom documentation

This documentation is aimed at people who would like to work with virtual-dom directly, or gain a deeper understanding of how their virtual-dom based framework works. If you would rather be working at a higher level, you may find the mercury framework a better place to start.

Overview

virtual-dom consists of four main parts:

vtree - responsible for diffing two virtual representations DOM nodes
vdom - responsible for taking the patch genereated by vtree/diff and using it to modify the rendered DOM
vnode - virtual representation of dom elements
virtual-hyperscript - an interface for generating VNodes from simple data structures

Newcomers should start by reading the VNode and VText documentation, as virtual nodes are central to the operation of virtual-dom. Hooks, Thunks, and Widgets are more advanced features, and you will find both documentation of their interfaces and several examples on their respective pages.

Contents

VNode - A representation of a DOM element

VText - A representation of a text node

Hooks - The mechanism for executing functions after a new node has been created

Thunk - The mechanism for taking control of diffing a specific DOM sub-tree

Widget - The mechanism for taking control of node patching: DOM Element creation, updating, and removal.