I’m considering using useMemo in this hook, but I’m not sure if would even provide any benefits.
In the example below, should I return the value with useMemo?
const useBooleanState: IUseBooleanState = (defaultValue) => {
const [value, setValue] = useState(defaultValue ?? false);
const setTrue = useCallback(() => {
setValue(true);
}, [setValue]);
const setFalse = useCallback(() => {
setValue(false);
}, [setValue]);
const toggle = useCallback(() => {
setValue((prev) => {
return !prev;
});
}, [setValue]);
return { value, setTrue, setFalse, toggle, setValue };
};
This is the useMemo option that I’m uncertain would be beneficial:
return useMemo(() => {
return { value, setTrue, setFalse, toggle, setValue };
}, [value, setTrue, setFalse, toggle, setValue]);
I’ve used useMemo in many React components to improve performance, but I still struggle with some cases where it’s difficult to determine if it’s actually helping or not.