抛开已经过时的 Mixin，React 界如今活跃着三种关于逻辑复用的技术：Hooks，HOCs 以及 Render Props。
从年龄上看，HOCs > Render Props > Hooks。每当新技术产生，业界总是不乏各种推陈出新的呼声，推荐大家 prefer 新技术 rather 旧技术。在我看来，这三种技术能够解决的问题虽然有重叠，但并不至于吃死任何一方。本文不展开介绍每种技术具体是什么，而主要聊聊每种技术都有哪些适应场景。
Hooks
最新的 Hooks 使得我们可以在函数组件中『挂入』组件的生命周期，这种能力之前是只能在类组件中实现的。由此，理论上我们可以逐渐剔除掉类组件了（prefer 函数组件）。虽然 React 官方声明暂时不会放弃类组件，但是至少从这一版本开始，分层逐渐明显，上层应用开发者几乎可以只编写函数组件，从而大大降低了学习成本，而代码也将变得更加优雅。
相比于类组件，使用 hooks 的组件，其切分维度是『特性』，而不是生命周期，这使得我们更容易管理其复杂性。
推荐在一般场景优先考虑使用 hooks 技术。
推荐 react-use 包，极大地扩展了官方提供的 hooks。
Render Props
这种技术现在的使用场景已经被压缩得相对比较窄了，不过，在大组件局部优化上，仍然非常得力。
例如，使用 hooks 的组件，当任一特性触发重渲染时，该组件的整个 render 方法都将重新执行，而其返回的整个组件树都将被重新渲染。而使用 Render Props，我们可以将那些会频繁触发重渲染的特性仅用于需要他们的部分，从而使得其他稳定部分不跟随他们进行无用的重渲染。
HOCs
使用 hooks 替代 HOCs 的呼声最高了，然而，并不会。HOCs 不仅使用起来非常优雅，而且在无入侵式扩展及组合式复用方面有着独特的价值。
无入侵式扩展
你已经有了一个无状态的 UI 组件，现在需要为其绑定一些状态或业务逻辑，生成一个 Smart 组件。
使用 hooks 或 Render Props，你不得不编写一个新组件，然后在 Render 函数中应用这些可复用特性。
然而，如果你使用 HOCs 技术，那么你只需要用高阶组件合理地去包裹原始组件就可以了。
组合式复用
想要组合使用多个可复用特性，如果使用 Hooks 或 Render Props，要么，在组件中零散地选择应用这些特性，要么，去编写组合了这些特性的 hook 或 Render Props 组件。
而对于 HOCs 来说，组合特性优雅得只需要对这些高阶组件（函数）进行 compose。这个 compose 并没有什么特别之处，即使 lodash.fp.compose 也足以胜任，这正是纯粹的函数之美。
总结
- 一般情况下，使用 Hooks 就可以了
- 如果希望将特性仅应用于组件树的一部分，使用 Render Props
- 如果希望特性能够被优雅地组合复用，使用 HOCs
