72

我刚刚听说 react-fiber 准备好了。react和react-fiber之间的最大区别是什么?为这些差异学习全新的概念是否值得?

4

4 回答 4

79

React Fiber是对 React 核心算法的持续重新实现,它只是对 React 的完全内部重写

React Fiber 是对 React 核心的完整、向后兼容的重写。

React Fiber的目标是提高其在动画、布局和手势等领域的适用性。它的主要功能是增量渲染:能够将渲染工作分成块并将其分散到多个帧上。

React Fiber是一个虚拟堆栈框架,React Fiber 是专门用于 React 组件的堆栈框架的重新实现。每个纤程可以被认为是一个虚拟堆栈帧,其中来自帧的信息保存在堆的内存中,并且由于信息保存在堆中,因此您可以控制和使用数据结构并根据需要处理相关信息。

您可以在此视频中找到 Lin Clark 的精彩解释。

有关更多详细信息,请查看以下链接,

1.什么是反应纤维?

2. React Fiber 架构

3. React 16 对你意味着什么?

希望这会帮助你!

于 2017-07-27T04:52:41.870 回答
24

React Fiber 是对 React 核心算法的不断重新实现。React 和 React Fiber 的主要区别在于这些新功能:-

  1. 增量渲染:- React v16.0 包含一个完全重写的服务器渲染器。它真的很快。它支持流式传输,因此您可以更快地开始向客户端发送字节

  2. 处理渲染 API 中的错误: 为了使类组件成为错误边界,我们定义了一个名为 componentDidCatch(error, info) 的新生命周期方法。

  3. 从渲染返回多个元素:使用 React v16.0 中的这个新特性,现在我们还可以从组件的渲染方法返回一个元素数组和字符串。

  4. 门户:门户提供了一种一流的方式来将子级渲染到存在于父组件的 DOM 层次结构之外的 DOM 节点中。

  5. 片段:React 中的一个常见模式是组件返回多个元素。片段让您可以对子列表进行分组,而无需向 DOM 添加额外的节点。

于 2018-02-01T19:00:05.773 回答
15

React 16 测试版已于数小时前发布:https ://github.com/facebook/react/issues/10294 。

重写的React 核心(内部称为“光纤”)应该与现有应用程序保持兼容,除了一些重大更改(请参阅 Github 上的发行说明)。由于大多数更改都在幕后,您无需再次学习全新的概念。

于 2017-07-27T04:48:48.730 回答
9

这里的每个人都已经提到了 React Fiber 即将推出的所有新功能。我将重点介绍 React Fiber 正在做哪些核心更改来改进自己。React Fiber 实际上将允许暂停和播放浏览器执行的不同任务。它将优先于某些任务。

例如,如果特定动画很重要,而不是在后台获取数据。它将动画任务作为优先级推送到执行堆栈中,一旦动画完成或耗时过长可以切换到数据获取任务。为了允许这些现代浏览器开放了一个 API,即 requestIdleCallback,它允许暂停和播放任务。 请求空闲回调

反应纤维使用的是什么。这就是反应纤维在引擎盖中使用的东西,这太神奇了。

注意:我可能在几点上并不完全正确。如果有任何更正,我愿意接受任何更正

于 2018-04-08T13:08:36.410 回答