🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
DemoInstallSign in
Socket

basic-virtual-dom

Package Overview
Dependencies
Maintainers
1
Versions
18
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

basic-virtual-dom

Basic virtual dom implementation

0.3.3
latest
Source
npm
Version published
Weekly downloads
4
100%
Maintainers
1
Weekly downloads
 
Created
Source

Very basic virtual-dom implementation

Build Status Coverage Status dependencies alpha npm version

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

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

Keywords

virtual-dom

FAQs

Package last updated on 30 Mar 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts