前置知识

dom.innerHTML = "xxxx"; dom.style.xx = "xxxx";

改动真实DOM后，不会立即渲染到页面上，它会等到浏览器下一次渲染时间点（60HZ就是每16.67ms）到达
这也可以用js主线程和ui线程互斥理解

useLayoutEffect 和 useEffect 的区别：
useEffect：是用户看到新的渲染结果之后执行的，是异步的；如果在它里面操作真实DOM则会看到闪烁
useLayoutEffect：完成了DOM改动，但还没有呈现到页面上；所以如果操作真实DOM副作用，就在这里即可

但是，应该尽量使用useEffect，因为它不会导致渲染阻塞。如果出现了问题，再考虑useLayoutEffect。