Inferno Simple Clock demo (JSX)

Starting point for creating JSFiddles with Inferno. This uses Inferno.

HTML

<script src="https://unpkg.com/inferno@latest/dist/inferno.min.js"></script>
<script src="https://unpkg.com/@babel/[email protected]/babel.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/infernojs/inferno@master/browser/inferno.babel.umd.6.6.0.min.js"></script>
<script src="https://cdn.rawgit.com/infernojs/inferno/master/browser/jsfiddle-integration-babel7v3.js"></script>
<!-- This element's contents will be replaced with your component. -->
<div id="container"></div>

JavaScript 1.7

// normally these would come in the form of ES2015 import statements
const { render, Component, version } = Inferno;

class Clock extends Component {
    constructor() {
        super();
        // set initial time:
        this.state = {
	        time: Date.now()
        };
    }

    componentDidMount() {
        // update time every second
        this.timer = setInterval(() => {
            this.setState({ time: Date.now() });
        }, 1000);
    }

    componentWillUnmount() {
        // stop when not renderable
        clearInterval(this.timer);
    }

    render() {
        let time = new Date(this.state.time).toLocaleTimeString();
        return (
        	<div>
          	<span>{ 'Inferno version: ' + version }</span>
            <br/>
        		<span>{ time }</span>
          </div>
        );
    }
}

// render an instance of Clock into <body>:
render(<Clock />, document.getElementById('container'));