diff --git a/packages/benchmarks/src/app/Layout.js b/packages/benchmarks/src/app/Layout.js
index 05b9afc3..4f1ebd29 100644
--- a/packages/benchmarks/src/app/Layout.js
+++ b/packages/benchmarks/src/app/Layout.js
@@ -19,11 +19,13 @@ export default class Layout extends Component {
const { widescreen } = this.state;
return (
- {viewPanel}
+
+ {viewPanel}
+
- {listPanel}
+ {listPanel}
- {actionPanel}
+ {actionPanel}
);
@@ -59,5 +61,8 @@ const styles = StyleSheet.create({
},
stackPanel: {
height: '33.33%'
+ },
+ layer: {
+ transform: [{ translateZ: '0' }]
}
});
diff --git a/packages/benchmarks/src/app/ReportCard.js b/packages/benchmarks/src/app/ReportCard.js
index 3d3693cb..babab4e8 100644
--- a/packages/benchmarks/src/app/ReportCard.js
+++ b/packages/benchmarks/src/app/ReportCard.js
@@ -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 (
-
-
-
- {`${libraryName}${libraryVersion ? '@' + libraryVersion : ''}`}
-
-
- {benchmarkName} {sampleCountText}
-
+ const sampleCountText = sampleCount != null ? `(${sampleCount})` : '';
+
+ return (
+
+
+
+ {`${libraryName}${libraryVersion ? '@' + libraryVersion : ''}`}
+
+
+ {benchmarkName} {sampleCountText}
+
+
+
+ {mean ? (
+
+
+ {fmt(mean)} ±{fmt(stdDev)} ms
+
+
+ Σ =
+ {Math.round(runTime)} ms
+
+
+ ) : (
+ In progress…
+ )}
+
-
- {mean ? (
-
-
- {fmt(mean)} ±{fmt(stdDev)} ms
-
-
- Σ =
- {Math.round(runTime)} ms
-
-
- ) : (
- In progress…
- )}
-
-
- );
-};
+ );
+ }
+}
const styles = StyleSheet.create({
root: {