react

by wuct

HTML

<script src="https://unpkg.com/eventemitter2/lib/eventemitter2.js"></script>
<script src="https://unpkg.com/[email protected]/dist/react-with-addons.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/react-dom.min.js"></script>

<div id="root"></div>

JavaScript

class TestComponent extends React.Component {
  render () {
    return React.createElement('div')
  }
}

const TestFunc = () => React.createElement('div')

console.log('Start testing...')

const start = performance.now()

for (let i = 0; i < 10000000; i++) {
  React.createElement('div')
}

const hostEnd = performance.now()

for (let i = 0; i < 10000000; i++) {
  React.createElement(TestComponent)
}

const classEnd = performance.now()

for (let i = 0; i < 10000000; i++) {
  React.createElement(TestFunc)
}

const functionEnd = performance.now()



console.table({
  host: new Record(hostEnd - start),
  class: new Record(classEnd - hostEnd),
  function: new Record(functionEnd - classEnd),
})


function Record(time) {
  this['time (ms)'] = time
}