React Hooks BetterUseEffect - A replacement of useEffect

js

import { useEffect, useRef } from "react";

export const usePrevious = (value) => {
    const ref = useRef();
    useEffect(() => {
      ref.current = value;
    });
    return ref.current;
  }

export const useComponentDidUpdate = (
    effect,
    dep = []
) => {
    const hasMounted = useRef(false);
    useEffect(() => {
        if (!hasMounted.current) {
            hasMounted.current = true;
            return;
        }
        effect();
    },dep);
}

export const useFirstRun = () => {
    const firstrun = useRef(false);

    useEffect(() => {
        if (!firstrun.current) {
            firstrun.current = true;
        }
    })

    return firstrun.current;

}


export const BetterUseEffect = (
    effect,
    dep 
) => {
        const firstrun = useFirstRun();
        const prevDep = usePrevious(dep);

        firstrun && effect({
            previus : prevDep,
            changed :  Object.keys(prevDep).filter(k => prevDep[k] !== dep[k]),
            firstrun,
        });
}