<commit_before># VDom

Virtual DOM library for [Dart](https://www.dartlang.org/) inspired by
[ReactJS Reconciliation](http://facebook.github.io/react/docs/reconciliation.html).

## API

### `Context`

Context is an object that is used to pass specific details to the
subtree.

Default Context is a simple object with `isAttached` property.

In the Liquid library, `Component` class implements this interface,
and is used to establish ownership relationships.

### `Node`

#### `void create(Context context)`

Creates a root-level html node for this virtual Node. It is essential
to render Nodes in two steps, so we can propagate attached calls at
the same time as we render subtrees.

Two-step rendering is also solves problem when you need to stop at any
point in `render()` to wait for async operations. When we create
root-level html node, we can just place it as a placeholder in the DOM
and wait for any async operation to finish.

#### `void render(Context context)`

Render attributes, styles, classes, children, etc. "Second step" in ours
two-step rendering model.

#### `void update(Node other, Context context)`

Apply changes to the DOM and transfer state from the previous virtual
tree to the new one.

## Usage example

```dart
import 'dart:html';
import 'dart:async';
import 'package:vdom/vdom.dart' as v;

int count = 0;
v.Element root;

void increment(){
  count += 1;
  rerender();
}

void rerender() {
  var next = render();
  root.update(next, const v.Context(true));
  root = next;
}

v.Element render(){
  return new v.Element('div')(count.toString());
}

void main() {
   root = render();
   root.create(const v.Context(false));
   document.body.append(root.ref);
   root.init();
   root.attached();
   root.render(const v.Context(true));
   new Timer.periodic(const Duration(seconds: 1), (t){ increment(); });
}
```<commit_msg>Fix position of lifecycle method `init` in example<commit_after># VDom

Virtual DOM library for [Dart](https://www.dartlang.org/) inspired by
[ReactJS Reconciliation](http://facebook.github.io/react/docs/reconciliation.html).

## API

### `Context`

Context is an object that is used to pass specific details to the
subtree.

Default Context is a simple object with `isAttached` property.

In the Liquid library, `Component` class implements this interface,
and is used to establish ownership relationships.

### `Node`

#### `void create(Context context)`

Creates a root-level html node for this virtual Node. It is essential
to render Nodes in two steps, so we can propagate attached calls at
the same time as we render subtrees.

Two-step rendering is also solves problem when you need to stop at any
point in `render()` to wait for async operations. When we create
root-level html node, we can just place it as a placeholder in the DOM
and wait for any async operation to finish.

#### `void render(Context context)`

Render attributes, styles, classes, children, etc. "Second step" in ours
two-step rendering model.

#### `void update(Node other, Context context)`

Apply changes to the DOM and transfer state from the previous virtual
tree to the new one.

## Usage example

```dart
import 'dart:html';
import 'dart:async';
import 'package:vdom/vdom.dart' as v;

int count = 0;
v.Element root;

void increment(){
  count += 1;
  rerender();
}

void rerender() {
  var next = render();
  root.update(next, const v.Context(true));
  root = next;
}

v.Element render(){
  return new v.Element('div')(count.toString());
}

void main() {
   root = render();
   root.create(const v.Context(false));
   root.init();
   document.body.append(root.ref);
   root.attached();
   root.render(const v.Context(true));
   new Timer.periodic(const Duration(seconds: 1), (t){ increment(); });
}
```
{'fraction_non_alphanumeric': 0.1172063152261172, 'fraction_numerical': 0.0016055659620016055, 'mean_word_length': 4.370689655172414, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 2, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2027169', 'n_tokens_mistral': 1131, 'n_tokens_neox': 1098, 'n_words': 457}