useMemo:

Un gancho utilizado para memorizar un valor , cuando cambian ciertos valores de la matriz de dependencia.

En su lugar, useCallback memoriza una función, una devolución de llamada, de modo que cuando el componente se vuelve a representar, no es necesario volver a calcular la función completa.

Uso de muestra de UseMemo:

Por ejemplo, desea calcular el total del pago del carrito. Memorizaré ese valor total y solo lo cambiaré cuando el porcentaje de impuestos también cambie.

 const total = useMemo(() => taxes + subtotal, [taxes]);

UseCallBack ejemplo de uso:

Quiero realizar varias llamadas a una API o una base de datos para buscar ciertos valores (por ejemplo, en una barra de búsqueda), pero no quiero que el componente vuelva a calcular la función cada vez que se procesa, así que memorizo la función:

 const getCharacters = useCallback(() => { if(input.trim() !== ""){ const value = input.toLocaleLowerCase() const chars = Characters.filter((character) => { return character.name.toLowerCase().includes(value)} ) setCharacters(chars) }else { setCharacters([]) } }, [input]);

Por lo general, useCallback se usa cuando también se necesita un gancho useEffect, para montar un elemento cuando cambia cierta dependencia:

 useEffect(() => { getCharacters() }, [input, getCharacters]);