我正在从事一个React-Native
项目,因此,我应该在Screen中生成大量View
元素。最后,我得到了想要的东西,但我怀疑它的性能很好。假设我的代码如下:
import React, { createElement } from 'react';
import { View, StyleSheet, Dimensions } from 'react-native';
const HEIGHT = Dimensions.get('window').height;
const redOrBlack = num => num%2 ? '#f00' : '#000';
const rows = () => {
const rows = [];
for (let i = 1; i <= HEIGHT; i += 1) {
const row = createElement(
View,
{
key: `row_${i}`,
style: [styles.row, { backgroundColor: redOrBlack(i) }
},
null
);
rows.push(row);
}
return rows;
};
export default () => (
<View style={styles.wrapper}>
{rows()}
</View>
);
const styles = StyleSheet.create({
wrapper: {
flex: 1,
position: 'relative'
},
row: {
width: '100%',
height: 1
}
});
上面的代码只是我的项目的一小部分。屏幕中将建立大量View
元素。我如何了解它的性能?请告诉我我的代码的性能。