Components keep being added when updating state about preact HOT 1 CLOSED

import { render } from "preact"
import { useEffect, useState } from "preact/hooks"

const B = () => <div>B</div>

const Test = () => {
    const [state, setState] = useState(true)
    useEffect(() => {
        const timer = setInterval(() => {
            setState((s) => !s)
        }, 250)
        return () => { clearInterval(timer) }
    }, [])

    if (state) {
        return <div>
            <B />
            <div></div>
        </div>
    } else {
        const cond = false
        return <div>
            <div></div>
            {null}
            <B />
        </div>
    }
}

render(<Test />, document.body)