react理念(二)

news2024/10/12 5:53:05

react-fiber

虚拟dom在react16中称为fiber。

在react15之前，协调器采用递归的方式来创建dom，递归的过程是不能中断的，如果组件书的层级很深，递归会占用线程很多时间，造成卡顿。为了解决这个问题，react16将递归的无法中断的更新重构为异步的可中断的更新。

作为架构来说，react15的协调器使用递归的方式执行，数据保存在递归调用栈中，被称为stack reconciler, 在react16中，被成为fiber reconciber。
作为静态的数据结构来说，每个fiber节点对应的react元素，保存了组件的类型，对应的dom节点等信息。
作为动态的工作单元来说，每个fiber节点保存了本次更新中该组件改变的状态，要执行的工作。

每个fiber节点有对应的react element，多个fiber节点会形成树。

// 指向父级fiber节点
this.return = null
// 指向子fiber节点
this.child = null
// 指向右边的第一个兄弟fiber节点
this.sibling = null

在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2207174.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！