第一組讀書會 5-6 ~ 5-7

[Beginneraboutlife116]

useCallback & useMemo 使用的正確時機

p4
function component & hooks 是屬於 資料流 的一部份

p5
useCallback 並不是來效能優化的

p6
dependencies 為必填

p12
useCallback 讓資料流的變化連動反應到函式的變化

p17
現在多用 custom hooks 來取代 Higher Order Component

p29
優化機制：useEffect, memo

p30 - 1: useCallback 正確的用途以及適當的使用時機是什麼?

正確的用途是「讓我們的函式能夠反應資料流的變化」

p30 - 2: useMemo 正確的用途以及適當的使用時機是什麼?

正確用途：當 object, array 需要被 cache 的時候

Hooks 的運作原理和設計思維

p36
Fiber node 是最新的資料，而 React element 是某一個時刻的寫照

p54
應該是因為 fiber node 是這樣設計的，所以使得我們使用 hook 的時候才這樣做

p59
可以推論我們會需要寫到很多重複的事情，如生命週期等

p66
自定義 key 會有命名衝突

p74
現階段已不太會遇到鑽石問題了，因為不再使開發者「自定義 key」了，改用 index 的方式避開

p77 - 1: Hooks 的資料本體到底存放在何處?

p77 - 2: 為什麼 hooks 的運作是依賴於固定的呼叫順序?

因為資料在 fiber node 是以 Linked list 存放，如果一個資料被跳過就會導致程式資料發生錯誤

p77 - 3: Hooks 如何透過順序式的資料結構設計來避免巢狀呼叫時的鑽石問題?

透過不用「自定義命名」而是用順序性的方式去呼叫，就不會有命名衝突的問題

其他 Q & A

custom hook 內的 async function 是否也需要包 useCallback？

端看 return 是否為 function ，這時候可以考慮是否要使用 useCallback

memo 的使用時機？

看是否需要做到效能優化再考慮，如果可以的話，memo 可以作為最後的手段，先看是否有其他的方法改善該 component 一直 render 問題。

對於後續的學習有沒有什麼建議？

這本書只有前半端，而後半端則從實戰開始，但順序是可以來回的相互補充的，沒有說一定要把前面都補才開始。

幫 Zet 填一下差單，有關於此書的回饋：https://forms.gle/Kzr8mtn8nLFqa7QWA

[LoisChen68]

補個簡報連結：https://drive.google.com/file/d/1JhNkJ00RvvPTpy8GhXO2G1dTv_bavjEh/view?usp=sharing