.jsx

class Hello extends vidom.Component {
    onInit() {
        this.setState({ counter : 1 });
    }

    onRender() {
        return (
            <div>
            <div>Root counter {this.state.counter}</div>
            {this.state.counter % 2 === 0 ? <Counter1 /> : <Counter2 />}
            {this.state.counter % 2 === 1 ? <Counter1 /> : <Counter2 />}
            </div>
        );
    }

    onMount() {
        setInterval(() => {
            this.setState({ counter : this.state.counter + 1 });
        }, 1000);
    }
}


class Counter1 extends vidom.Component {
    onInit() {
        this.setState({ counter : 1 });
    }

    onRender() {
        return (
            <div>
	            <div>Counter1 { this.state.counter }</div>
            </div>
        );
    }

    onMount() {
        setInterval(() => {
            this.setState({ counter : this.state.counter + 1 });
        }, 1000);
    }
}

class Counter2 extends vidom.Component {
    onInit() {
        this.setState({ counter : 1 });
    }

    onRender() {
        return (
            <div>
	            <div>Counter2 { this.state.counter }</div>
            </div>
        );
    }

    onMount() {
        setInterval(() => {
            this.setState({ counter : this.state.counter + 1 });
        }, 1000);
    }
}




vidom.mount(document.body, <Hello name="World"/>);