react setTimeout能保证到下一个ui render吗?

Question

Vue的$nexttick采用mo来保证dom渲染
而setTimeout比micro更加推迟,nexttick里的低版本浏览器退位也是用settimeout实现的
那么react里 是否能保证在整个render过程中,uirender仅在一个event loop里执行?如果如此,那么setTimeout必定能保证dom渲染

没看过react源码,请教一个各位大神.

Answer 1

不能，而且将来的版本可能更加激进地调度render task。

如果你需要依赖DOM更新做什么事，可以学习用hook。

Answer 2

我记得 setTimeout 是在 render 之后执行的，而你说的过程其实生命周期引发的吧？这种情况相当于重新执行了一遍 render，所以也比 event loop 开始要靠前。

Answer 3

刚写过一个帖子，涉及到了一点点vue的nexttick()函数；

vue2.0之前延时优先级是promise -> mutationObserver -> setTimeout搞定延时函数;
微任务优先宏任务的两点好处是：

1.更快的拿到更新后的数据；
2.浏览器在每次宏任务执行后会插入UI渲染，setTimeout会有2次渲染的弊端。

所以，setTimeout仅仅是兼容性。
目前采用的是MessageChannel;

react中基本原理是不变的，保证兼容性的情况下，一定会采用微任务处理，setTimeout不存在兼容问题作为备选存在。不使用异步的话，在mutationEvents利用事件绑定证明bug颇多，无力解决。

最后，能否确认在一个event loop中执行，要看执行环境
setTimeout必定能够保证一次渲染，答案是肯定的。

https://www.jianshu.com/p/ab5... 文章最下面，是有关vue的延时函数的解释，有兴趣可以看看

Answer 4

并不能，React 16 之后，采用 Fiber。 有任务调度的过程，如果渲染时间很长的话，会暂停渲染。可以了解下