响应本机内联样式和性能

Question

请执行以下操作：

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

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

<Text style={styles.blueButton} />

...

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

Answer 1

从文档的StyleSheet

性能：

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

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

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