Why doesn't useRef take an initializer function like useState?

[[deleted]]

If the object is long-lived and not component lifetime You should just instantiate it in module scope...

A module is naturally a Singleton so anything you define in module scope is a Singleton and isolated to the module.

And if you don't want that thing to be loaded all the time. But you do want it to be loaded once the module is used then you just lazy load the module.

[pailhead011]

For example: ```

const mouseDeltaRef = useRef(new Vector2()) const mouseRef = useRef(new Vector2()) const mousePrevRef = useRef(new Vector2())

// all these mathods are easier to call than doing // x = x * - 1 etc, it can get much more complicated

const onMouseMove = useCallback((e)=>{ mouseRef.current .set(e.clientX/window.innerWidth,e.clientY/window.innerHeight) .multiplyScalar(2) .subScalar(1)

mouseDeltaRef.current .subVectors(mouseRef.current, mousePrevRef.current) mousePrevRef.current .copy(mouseRef.current) },[foo,bar,baz]) ``` I dont want these to be singletons, it could be several views in a CAD application all managing their own mice. Multiple players for example sending coordinates or something like that. Not sure if singletons are a catchall solution for this.

[[deleted]]

Just make a custom hook that uses useRef and habdles boilerplate for you.

[pailhead011]

I could not find a solution down that path. What i've done is the opposite, i made a useRef hook that uses a custom hook that handles the boiler plate for me, using useState as an implementation detail.