Functional Reactive Component

funreact.js

export function reactiveComponent(fun) {
  class Reactive extends React.PureComponent {
    constructor(props) {
      super(props)
      this.state = {current: null}
    }
    componentDidMount() {
      (async () => {
        for await(const current of fun(this.props))
          this.setState({current})
      })()
    }
    render() {
      return this.state.current
    }
  }
  Reactive.displayName = fun.name
  return Reactive
}

const AsyncLoad = reactiveComponent(async function*(props){
    yield <div>loading...</div>
    yield await import(props.url)
})