// paste into react.jsbin.com
// remove scripts loading the actual react lib if any
// https://react.jsbin.com/godotur/1/edit?js,output
// React + ReactDOM.render (no virtual DOM)
function Co(p){this.props=p}A='appendChild',g=a=>a.map?a.flatMap(g):[a]
React={[C='createElement']:(t,p,...c)=>t.bind?new t(p):(e=document[C](t),(()=>{for(n in p)e[n]=p[n]})(),g(c).map(a=>e[A](a.tagName?a:new Text(a))),e)}
render=(r,h)=>(r.h=h,h[A](r.render()))
// the correct one
// function Co(p){this.props=p}A='appendChild',g=a=>(a||'').map?a.flatMap(g):[a||'']
// React={[C='createElement']:(t,p,...c)=>t.bind?new t(p):(e=document[C](t),(()=>{for(n in p)e[n]=p[n]})(),g(c).map(a=>e[A](a.tagName?a:new Text(a))),e)}
// render=(r,h)=>(r.h=h,h[A](r.render()))
// Additional plugin, if you also want setState
Co.prototype.setState=function(s){
this.state={...this.state,...s}
this.h.innerHTML=''
render(this,this.h)
}
// Usage
class App extends Co {
constructor(){super();this.state={count:0}}
handleClick() {this.setState({count:this.state.count+1})}
render() {
return (<div onclick={this.handleClick.bind(this)} style="color:green;font-weight:bold;">Count: {this.state.count}</div>);
}
}
render(
<App/>,
document.getElementById('container')
);