diff --git a/performance/benchmark.js b/performance/benchmark.js index 7b2fefe0..e21c4aab 100644 --- a/performance/benchmark.js +++ b/performance/benchmark.js @@ -6,24 +6,27 @@ const measure = (name, fn) => { marky.mark(name); fn(); const performanceMeasure = marky.stop(name); - return performanceMeasure; + return performanceMeasure.duration; }; const benchmark = ({ name, description, setup, teardown, task, runs }) => { return new Promise((resolve) => { - const performanceMeasures = []; + const durations = []; let i = 0; + console.group(`[benchmark] ${name}`); + console.log(description); + setup(); const first = measure('first', task); teardown(); const done = () => { - const mean = performanceMeasures.reduce((sum, performanceMeasure) => { - return sum + performanceMeasure.duration; + const mean = durations.reduce((sum, duration) => { + return sum + duration; }, 0) / runs; - const firstDuration = fmt(first.duration); + const firstDuration = fmt(first); const meanDuration = fmt(mean); console.log(`First: ${firstDuration}`); @@ -38,8 +41,9 @@ const benchmark = ({ name, description, setup, teardown, task, runs }) => { }; const b = () => { - performanceMeasures.push(measure('mean', task)); - window.requestAnimationFrame(c); + const duration = measure('mean', task); + durations.push(duration); + c(); }; const c = () => { @@ -56,8 +60,6 @@ const benchmark = ({ name, description, setup, teardown, task, runs }) => { } }; - console.group(`[benchmark] ${name}`); - console.log(description); window.requestAnimationFrame(a); }); }; diff --git a/performance/index.js b/performance/index.js index 2cb97be1..69f100f7 100644 --- a/performance/index.js +++ b/performance/index.js @@ -8,9 +8,9 @@ const node = document.querySelector('.root'); const DeepTree = createDeepTree(ReactNative); 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 }, 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: 4, depth: 3, breadth: 10, runs: 5, registerStyles: false }, node)) + .then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 5 }, node)) + .then(deepTree({ wrap: 4, depth: 3, breadth: 10, runs: 5, leafComponent: 'Image' }, node)) + .then(deepTree({ wrap: 1, depth: 5, breadth: 3, runs: 10 }, node)) .then(() => ReactDOM.render(, node));