分析React fiber
React fiber
现在的局限
fiber 目的
In order to do any of this,we first need a way to break work down into units. In one sense,that's what a fiber is. A fiber represents a unit of work. That's the purpose of React Fiber. Fiber is reimplementation of the stack,specialized for React components. You can think of a single fiber as a virtual stack frame. In concrete terms,a fiber is a JavaScript object that contains information about a component,its input,and its output. fiber 实现方式破解JavaScript中同步操作时间过长的方法其实很简单——分片。 React Fiber把更新过程碎片化,每执行完一个更新过程,将控制权交给react,它会根据优先级安排下一次的任务; 维护每一个分片的数据结构,就是Fiber。 参考文件 影响在现有的React中,每个生命周期函数在一个加载或者更新过程中绝对只会被调用一次;在React Fiber中,不再是这样了,第一阶段中的生命周期函数在一次加载和更新过程中可能会被多次调用! Reconciliation Phase:
Commit Phase:
好处:
坏处:
注意点:
错误的姿势 this.setState({ a: this.state.a + this.props.b }); 正确的姿势 this.setState((a,b) => ({ a: prevState.a + props.b })) fiber 的进展:http://isfiberreadyyet.com 欢迎来github上 start (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |