[ReactDoc] React Hooks - 較少用到的

Hooks API Reference @ React Docs

useLayoutEffect

useLayoutEffect 和 useEffect 非常相似，最大的差別在於 useLayoutEffect 會在 DOM render 完後，以同步（synchronous）的方式立刻接著執行；但 useEffect 則是以非同步的方式執行，也就是說，畫面 render 完後，瀏覽器有機會先做其他事，接著才執行 useEffect 中的函式。

一般來說，只會用在當你製作動畫，或需要測量 DOM 節點的寬高時，目的是為了避免這段期間瀏覽器的 DOM 有改變，導致誤差。

因為 useLayoutEffect 是同步的方法，一般來說，除非有必要，不然會建議使用 useEffect 來避免畫面的更新被阻塞（blocking）。