反应 createElement 与 cloneElement

Question

任何人都可以告诉我使用 cloneElement（在现有元素实例上）还是 createElement（在 React Element class 上）哪个在性能方面更好？

有时克隆某些东西比创建新实例更快。 请告诉我。谢谢

Answer 1

使用cloneElement通常会更快，因为您只需要实例化一个初始组件。

jsperf test 显示 cloneElement 在 Linux 上的 Chromium 45 几乎是 createElement 的两倍：

• cloneElement~1.7mops/second
• createElement~0.85mops/second

如果您有一个无需更改即可克隆的基础组件，那么使用 cloneElement 是一个明确的选择，无论是在语义上还是在性能方面。

Answer 2

在 Safari 10.0.3 中，对于上述 JSPerf test，cloneElement 慢了 31%（在 Chrome 中，createElement 对我来说慢了 17%）。

我还制作了另一个 JSPerf test，其中将 cloneElement 与 "function-as-children" 进行了比较。在这种情况下，cloneElement 在 Chrome (26%) 和 Safari (46%) 中都慢了很多。