网站内容更新策略( ReactJS中的批量更新的策略(一)|)

优采云 发布时间: 2021-10-10 16:00

  网站内容更新策略(

ReactJS中的批量更新的策略(一)|)

  

  在这个文章中,我们将继续从源码的角度学习React JS中的批量更新State策略,以便我们继续深入研究React。

  前面文章列表

  1.batchingStrategy 策略

  现在我们开始看batchingStrategy的策略定义。

  目前React中batchingStrategy的定义是ReactDefaultBatchingStrategy。

  ReactDefaultBatchingStrategy 由两部分组成。

  

  实现就在这里。

  请注意,在实现中定义了一个叫做 pooled 的东西。稍后我们将讨论这种设计的原则和好处。

  React 将所有组件放入池中,然后将它们交给 runBatchedUpdates 来执行更新操作。

  同理,也有asap这个概念,后续文章也有讨论。

  

  对所有组件执行 performUpdateIfNecessary 判断并更新组件。

  

  

  2. 组件是否需要更新的比较 performUpdateIfNeeded

  两种逻辑,比较组件是否需要更新,在第二种情况下直接进行强制更新。

  ReactReconciler.receiveComponent 在元素级别进行比较,但如果不同,则调用 receiveComponent。

  其他状态,直接调用updateComponent。

  注意这里updateComponent函数的内部实现是递归的。这样的设计,方便及时获取哪些组件的更新状态,方便前台获取使用。

  

  

  到此,我们已经完成了 React 的更新逻辑策略的整个部分。接下来我们继续看看React是如何更新页面UI的以及一些剩余的小知识点。

0 个评论

要回复文章请先登录注册


官方客服QQ群

微信人工客服

QQ人工客服


线