mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-05-26 07:49:18 +00:00
Benchmark app component optimizations
This commit is contained in:
@@ -19,11 +19,13 @@ export default class Layout extends Component {
|
||||
const { widescreen } = this.state;
|
||||
return (
|
||||
<View onLayout={this._handleLayout} style={[styles.root, widescreen && styles.row]}>
|
||||
<View style={widescreen ? styles.grow : styles.stackPanel}>{viewPanel}</View>
|
||||
<View style={[widescreen ? styles.grow : styles.stackPanel, styles.layer]}>
|
||||
{viewPanel}
|
||||
</View>
|
||||
<View style={styles.grow}>
|
||||
<View style={styles.grow}>{listPanel}</View>
|
||||
<View style={[styles.grow, styles.layer]}>{listPanel}</View>
|
||||
<View style={styles.divider} />
|
||||
<View>{actionPanel}</View>
|
||||
<View style={styles.layer}>{actionPanel}</View>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
@@ -59,5 +61,8 @@ const styles = StyleSheet.create({
|
||||
},
|
||||
stackPanel: {
|
||||
height: '33.33%'
|
||||
},
|
||||
layer: {
|
||||
transform: [{ translateZ: '0' }]
|
||||
}
|
||||
});
|
||||
|
||||
@@ -8,45 +8,49 @@ const fmt = (time: number) => {
|
||||
return 10 / i > 1 ? `0${i}` : i;
|
||||
};
|
||||
|
||||
const ReportCard = ({
|
||||
benchmarkName,
|
||||
libraryName,
|
||||
sampleCount,
|
||||
mean,
|
||||
stdDev,
|
||||
runTime,
|
||||
libraryVersion
|
||||
}) => {
|
||||
const sampleCountText = sampleCount != null ? `(${sampleCount})` : '';
|
||||
class ReportCard extends React.PureComponent {
|
||||
render() {
|
||||
const {
|
||||
benchmarkName,
|
||||
libraryName,
|
||||
sampleCount,
|
||||
mean,
|
||||
stdDev,
|
||||
runTime,
|
||||
libraryVersion
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<View style={styles.root}>
|
||||
<View style={styles.left}>
|
||||
<Text numberOfLines={1} style={styles.bold}>
|
||||
{`${libraryName}${libraryVersion ? '@' + libraryVersion : ''}`}
|
||||
</Text>
|
||||
<Text numberOfLines={1}>
|
||||
{benchmarkName} {sampleCountText}
|
||||
</Text>
|
||||
const sampleCountText = sampleCount != null ? `(${sampleCount})` : '';
|
||||
|
||||
return (
|
||||
<View style={styles.root}>
|
||||
<View style={styles.left}>
|
||||
<Text numberOfLines={1} style={styles.bold}>
|
||||
{`${libraryName}${libraryVersion ? '@' + libraryVersion : ''}`}
|
||||
</Text>
|
||||
<Text numberOfLines={1}>
|
||||
{benchmarkName} {sampleCountText}
|
||||
</Text>
|
||||
</View>
|
||||
<View style={styles.right}>
|
||||
{mean ? (
|
||||
<Fragment>
|
||||
<Text style={[styles.bold, styles.monoFont]}>
|
||||
{fmt(mean)} ±{fmt(stdDev)} ms
|
||||
</Text>
|
||||
<Text style={[styles.monoFont, styles.centerText]}>
|
||||
<Text style={styles.smallText}>Σ = </Text>
|
||||
<Text>{Math.round(runTime)} ms</Text>
|
||||
</Text>
|
||||
</Fragment>
|
||||
) : (
|
||||
<Text style={styles.bold}>In progress…</Text>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
<View style={styles.right}>
|
||||
{mean ? (
|
||||
<Fragment>
|
||||
<Text style={[styles.bold, styles.monoFont]}>
|
||||
{fmt(mean)} ±{fmt(stdDev)} ms
|
||||
</Text>
|
||||
<Text style={[styles.monoFont, styles.centerText]}>
|
||||
<Text style={styles.smallText}>Σ = </Text>
|
||||
<Text>{Math.round(runTime)} ms</Text>
|
||||
</Text>
|
||||
</Fragment>
|
||||
) : (
|
||||
<Text style={styles.bold}>In progress…</Text>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
root: {
|
||||
|
||||
Reference in New Issue
Block a user