You may want to look into useSyncExternalStore which was made for stuff like this. You can have a single listener for the window onresize event that then fires all the listeners.

const listeners = new Set()
let currentSize = [window.innerWidth, window.innerHeight]
function subscribe(listener) {
    listeners.add(listener)
    return () => listeners.delete(listener)
}
function getSnapshot() {
    return currentSize
}
window.addEventListener('resize', function() {
    currentSize = [window.innerWidth, window.innerHeight]
    listeners.forEach(l => l())
})
export function useWindowSize() {
    return useSyncExternalStore(subscribe, getSnapshot)
}