React Native 内联样式和性能

Question

执行以下操作：

 <Text style={{color: 'blue', fontSize: 30}} />

与以下相比有任何性能影响：

 <Text style={styles.blueButton} />

...

const styles = StyleSheet.create({
  blueButton: {
    color: 'blue',
    fontSize: 30,
  }
});

原文由 Martin Konicek 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

来自 的 文档 StyleSheet

表现：

• 从样式对象制作样式表可以通过 ID 引用它，而不是每次都创建新的样式对象。
• 它还允许仅通过桥发送样式一次。所有后续使用都将引用一个 id（尚未实现）。

另一个好处是样式错误将在编译时而不是运行时生成。

我个人仍然喜欢使用内联样式（并为共享样式创建新组件），因为它使代码对我来说更具可读性并且性能影响并不明显。

原文由 FuzzyTree 发布，翻译遵循 CC BY-SA 3.0 许可协议