useLayoutEffect
useLayoutEffect和useEffect有什么区别呢?
useEffect的cb,准确来说,是异步调用的,会等主线程任务执行完成,D0M更新,JS执行完成,视图绘制完成,才执行。
useLayoutEffect的cb,是同步执行的,执行时机是DOM更新之后,视图绘制完成之前,这个时间可以更方便的修改 DOM。
如果要改 DOM, 用useLayoutEffect, 其他都用useEffect 。
useInsertionEffect
useInsertionEffect比useLayoutEffect更早。useInsertionEffect 执行时,DOM还没有更新。
本质上useInsertionEffect主要是解决 css-in-js 在渲染中注入样式的性能问题。
哪个和componentDidMount、componentDidUpdate更类似
componentDidMount、componentDidUpdate是同步的,所以useLayoutEffect更类似。