Fre canvas renderer

[yisar]

I want to write a game engine, which is a route for the future.

Because most of engines are offscreens, which is very easy for fre. I can write a canvas render, and then canvas is used as background layer, and then DOM is used as entity layer.

At the same time, maybe I need to write an ECS-based game engine, while fre canvas only provides simple entities drawing, and Another framework for systems and components.

import { render as renderDom, h, useState } from 'fre'
import { render as renderCanvas } from 'fre/canvas'

const Canvas = () => {
  const [count, setCount] = useState(0)
  return <cycle onClick={() => setCount(count + 1)}>{count}</cycle>
}

const Dom = () => {
  const [count, setCount] = useState(0)
  return <button onClick={() => setCount(count + 1)}>{count}</button>
}

renderCanvas(<Canvas />, document.querySelector('canvas'))
renderDom(<Dom />, document.getElementById('root'))