关于javascript:React-hooks之痛低效的变化传播

最近看到如何去正当应用 React hook？ - Parabola的答复 - 知乎 。作者将React hooks的模型类比于rxjs的模型，比方rxjs的merge操作，在React的世界中能够这样实现：

它们的确能够了解成等价的。它们都是对数据计算关系的定义，输出2个数据流，输入1个数据流。

乍一看很有情理，然而越想越不对劲。真的能够应用hook来模拟rxjs响应式编程吗？

不能。React hooks有一个致命的缺点：数据变动每流传一步就须要期待1轮渲染。如果通过hook来定义计算关系，那么变动的流传会十分低效。

举个例子，原答复是这样实现distinctUntilChanged的：

它们也的确能够了解成等价的，让咱们用hooks写一个数据关系定义：

function useMyData(a) {    return useDistinctUntilChanged(           useDistinctUntilChanged(             useDistinctUntilChanged(a)));  }

咱们会发现，a变动当前，它的输入要经验3次从新渲染能力流传到useMyData的调用者（useMyData的调用者这个时候才会感知到数据变动）。这是十分低效的变动流传。

这个例子尽管比拟极其，然而如果通过hook来定义计算关系，那么这种状况其实会经常出现。在我看来，目前React hooks并不善于定义数据计算关系。