useMemo和useCallback是React中的兩個優化性能的鉤子（Hooks）。它們都可以用來緩存計算結果，避免在每次渲染時都重新執行耗時的操作。然而，它們的主要區別在于緩存的內容和使用場景。

useMemo useMemo用于緩存那些計算成本較高的值。它接收兩個參數：一個回調函數和一個依賴數組。當依賴數組中的任何一個值發生變化時，useMemo會重新執行回調函數并返回新的結果。如果依賴數組中的值沒有變化，則直接返回之前緩存的結果。這可以有效地避免在每個渲染周期中重復進行昂貴的計算。

const memoizedValue = useMemo(() => {// 這是一個耗費大量計算的函數return calculateExpensiveValue(a, b);
}, [a, b]);

useCallback useCallback的作用類似于useMemo，但它主要用于緩存函數而不是值。當你有一個需要頻繁創建的函數，并且該函數作為props傳遞給子組件時，你可以使用useCallback來確保只有當依賴項改變時才創建新的函數引用。這樣可以避免不必要的子組件更新。

const memoizedCallback = useCallback(() => {doSomething(a, b);},[a, b]
);

總結：

• useMemo用于緩存計算得到的值。
• useCallback用于緩存函數，特別是那些作為props傳遞給子組件的函數。

同時使用這兩個Hook可以提高React應用的性能，減少不必要的計算和組件更新。