linuxenko / Basic Virtual Dom

Very basic virtual-dom implementation

Features

Support of following patch types:

• PATCH_CREATE
• PATCH_REMOVE
• PATCH_REORDER
• PATCH_PROPS
• Small amount of diffing iterations
• Referal based patches without identifiers
• No iterations over the virtual or dom tree when applying patches

Seems like it has not so bad memory usage and rendering performance

Example

Simple day countdown example

/** @jsx h */

import {h, patch, diff} from '../../';

var initialDom = (
  <div>
    <div><h3>Counter</h3></div>
  </div>
);

document.getElementById('application')
  .appendChild(initialDom.render());

setInterval(function() {
  var cd = countDown();
  var countDownDom = (
    <div>
      <div><h3>Day Countdown</h3></div>
      <div className="clock">
        <strong>{cd.h}</strong> :&nbsp;
        <strong>{cd.m}</strong> :&nbsp;
        <strong>{cd.s}</strong>
      </div>
    </div>
  );

  var diffs = diff(initialDom, countDownDom);
  patch(initialDom, diffs);

}, 1000);

TODO

• test browser support

License

MIT (c) Svetlana Linuxenko