Preact Clock

HTML

<script src="https://npmcdn.com/preact@latest/dist/preact.js"></script>
<script src="https://ng-embedded-test.firebaseapp.com/es5-shim.js"></script>
<script src="https://ng-embedded-test.firebaseapp.com/angular.js"></script>
<script src="https://ng-embedded-test.firebaseapp.com/progress-bars.js"></script>

Babel + JSX

/** @jsx h */
const { h, render, Component } = preact;    // normally this would be an import statement.

class Demo extends Component {
    constructor() {
        super();
        // set initial progress:
        this.state.progress = 0;
    }

    componentDidMount() {
        // update time every second
        this.timer = setInterval(() => {
            this.setState({ progress: Math.floor(Math.random() * 100) });
        }, 1000);
    }

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

    render(props, state) {
        return <ng-progress-bar progress={state.progress}></ng-progress-bar>;
    }
}

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