zoriya/react-native-web
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-web.git synced 2026-05-29 17:12:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add image benchmark

Browse Source
This commit is contained in:
Nicolas Gallagher
2017-02-17 23:15:00 -08:00
parent 40b03aca52
commit e1fc253277
3 changed files with 20 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
performance/benchmarks/deepTree/createDeepTree.js
+10 -2
View File
@@ -1,6 +1,13 @@
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
const createDeepTree = ({ StyleSheet, View }, options = {}) => { /* eslint-disable */
const base64Icon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAQAAACSR7JhAAADtUlEQVR4Ac3YA2Bj6QLH0XPT1Fzbtm29tW3btm3bfLZtv7e2ObZnms7d8Uw098tuetPzrxv8wiISrtVudrG2JXQZ4VOv+qUfmqCGGl1mqLhoA52oZlb0mrjsnhKpgeUNEs91Z0pd1kvihA3ULGVHiQO2narKSHKkEMulm9VgUyE60s1aWoMQUbpZOWE+kaqs4eLEjdIlZTcFZB0ndc1+lhB1lZrIuk5P2aib1NBpZaL+JaOGIt0ls47SKzLC7CqrlGF6RZ09HGoNy1lYl2aRSWL5GuzqWU1KafRdoRp0iOQEiDzgZPnG6DbldcomadViflnl/cL93tOoVbsOLVM2jylvdWjXolWX1hmfZbGR/wjypDjFLSZIRov09BgYmtUqPQPlQrPapecLgTIy0jMgPKtTeob2zWtrGH3xvjUkPCtNg/tm1rjwrMa+mdUkPd3hWbH0jArPGiU9ufCsNNWFZ40wpwn+62/66R2RUtoso1OB34tnLOcy7YB1fUdc9e0q3yru8PGM773vXsuZ5YIZX+5xmHwHGVvlrGPN6ZSiP1smOsMMde40wKv2VmwPPVXNut4sVpUreZiLBHi0qln/VQeI/LTMYXpsJtFiclUN+5HVZazim+Ky+7sAvxWnvjXrJFneVtLWLyPJu9K3cXLWeOlbMTlrIelbMDlrLenrjEQOtIF+fuI9xRp9ZBFp6+b6WT8RrxEpdK64BuvHgDk+vUy+b5hYk6zfyfs051gRoNO1usU12WWRWL73/MMEy9pMi9qIrR4ZpV16Rrvduxazmy1FSvuFXRkqTnE7m2kdb5U8xGjLw/spRr1uTov4uOgQE+0N/DvFrG/Jt7i/FzwxbA9kDanhf2w+t4V97G8lrT7wc08aA2QNUkuTfW/KimT01wdlfK4yEw030VfT0RtZbzjeMprNq8m8tnSTASrTLti64oBNdpmMQm0eEwvfPwRbUBywG5TzjPCsdwk3IeAXjQblLCoXnDVeoAz6SfJNk5TTzytCNZk/POtTSV40NwOFWzw86wNJRpubpXsn60NJFlHeqlYRbslqZm2jnEZ3qcSKgm0kTli3zZVS7y/iivZTweYXJ26Y+RTbV1zh3hYkgyFGSTKPfRVbRqWWVReaxYeSLarYv1Qqsmh1s95S7G+eEWK0f3jYKTbV6bOwepjfhtafsvUsqrQvrGC8YhmnO9cSCk3yuY984F1vesdHYhWJ5FvASlacshUsajFt2mUM9pqzvKGcyNJW0arTKN1GGGzQlH0tXwLDgQTurS8eIQAAAABJRU5ErkJggg==';
/* eslint-enable */
const createDeepTree = (implementation, options = {}) => {
const { Image, StyleSheet, View } = implementation;
const TerminalComponent = options.leafComponent ? implementation[options.leafComponent] : View;
class DeepTree extends Component { class DeepTree extends Component {
static propTypes = { static propTypes = {
breadth: PropTypes.number.isRequired, breadth: PropTypes.number.isRequired,
@@ -21,7 +28,8 @@ const createDeepTree = ({ StyleSheet, View }, options = {}) => {
]} ]}
> >
{depth === 0 && ( {depth === 0 && (
<View <TerminalComponent
source={TerminalComponent === Image && { uri: base64Icon }}
style={[ style={[
styles.terminal, styles.terminal,
styles[`terminal${id % 3}`] styles[`terminal${id % 3}`]
performance/benchmarks/deepTree/index.js
+9 -2
View File
@@ -4,15 +4,22 @@ import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import ReactNative from 'react-native'; import ReactNative from 'react-native';
const deepTreeBenchmark = ({ breadth, depth, registerStyles = true, runs, wrap }, node) => () => { const deepTreeBenchmark = (config, node) => () => {
const { breadth, depth, leafComponent = 'View', registerStyles = true, runs, wrap } = config;
// React Native for Web implementation of the tree // React Native for Web implementation of the tree
const DeepTree = createDeepTree(ReactNative, { registerStyles }); const DeepTree = createDeepTree(ReactNative, { registerStyles });
const setup = () => {}; const setup = () => {};
const teardown = () => ReactDOM.unmountComponentAtNode(node); const teardown = () => ReactDOM.unmountComponentAtNode(node);
let name = `DeepTree: ${leafComponent}`;
if (!registerStyles) {
name += ' (unregistered styles)';
}
return benchmark({ return benchmark({
name: `DeepTree (${registerStyles ? 'registered' : 'unregistered'}) styles)`, name,
description: `depth=${depth}, breadth=${breadth}, wrap=${wrap}`, description: `depth=${depth}, breadth=${breadth}, wrap=${wrap}`,
runs, runs,
setup, setup,
performance/index.js
+1 -1
View File
@@ -9,8 +9,8 @@ const DeepTree = createDeepTree(ReactNative);
Promise.resolve() Promise.resolve()
.then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 10, registerStyles: false }, node)) .then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 10, registerStyles: false }, node))
.then(deepTree({ wrap: 1, depth: 5, breadth: 3, runs: 20, registerStyles: false }, node))
.then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 10 }, node)) .then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 10 }, node))
.then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 10, leafComponent: 'Image' }, node))
.then(deepTree({ wrap: 1, depth: 5, breadth: 3, runs: 20 }, node)) .then(deepTree({ wrap: 1, depth: 5, breadth: 3, runs: 20 }, node))
.then(() => ReactDOM.render(<DeepTree breadth={3} depth={5} id={0} wrap={1} />, node)); .then(() => ReactDOM.render(<DeepTree breadth={3} depth={5} id={0} wrap={1} />, node));