So my current setup that I made has multiple div progress bars with hover tooltips which follow the mouse cursor and update with a useEffect

    useEffect(() => {
        const controller = new AbortController()

        window.addEventListener("mousemove", (e) => {
            if (!(e.target instanceof HTMLDivElement)) return
            if (e.target.dataset.id !== tooltipId) return

            setPos({ x: e.clientX, y: e.clientY - 10 })
        }, { signal: controller.signal })

        return () => {
            controller.abort()
        }
    })

tho i would have a few of these on the page one for each progressbar tho i now moved to using a context and updating one value globally and passing it to all progress bars.

is there any performance difference between the 2 solutions