Skip to content

Instantly share code, notes, and snippets.

@nhunzaker
Created August 8, 2016 19:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nhunzaker/bd15286c2b2935942dde8f0cba2bd6ca to your computer and use it in GitHub Desktop.
Save nhunzaker/bd15286c2b2935942dde8f0cba2bd6ca to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="container">Loading...</div>
<script src="https://cdn.jsdelivr.net/lodash/4.14.1/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/2.1.1/benchmark.min.js"></script>
<script src="../../build/react.16.min.js"></script>
<script src="../../build/react-dom.16.min.js"></script>
<script src="/examples/input-bench/runner.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="container">Loading...</div>
<script src="https://cdn.jsdelivr.net/lodash/4.14.1/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/2.1.1/benchmark.min.js"></script>
<script src="../../build/react.min.js"></script>
<script src="../../build/react-dom.min.js"></script>
<script src="/examples/input-bench/runner.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
console.log('Running. One moment...')
</script>
<iframe width="0" height="0" frameborder="0" src="/examples/input-bench/control.html"></iframe>
<iframe width="0" height="0" frameborder="0" src="/examples/input-bench/experiment.html"></iframe>
</body>
</html>
var suite = new Benchmark.Suite
var container = document.getElementById('container')
var identity = function (n) { return n }
suite.add('controlled input', function() {
var input = React.createElement('input', {
value: Math.random() * 1000,
type: 'number',
step: (Math.random() * 1000) | 0,
onChange: identity
})
ReactDOM.render(input, container)
})
.add('uncontrolled input', function() {
var input = React.createElement('input', {
defaultValue: Math.random() * 1000,
type: 'number',
step: (Math.random() * 1000) | 0,
onChange: identity
})
ReactDOM.render(input, container)
})
.add('div', function() {
var div = React.createElement('div', {
id: Math.random(),
className: Math.random(),
'aria-hidden': true
}, 'This is child text')
ReactDOM.render(div, container)
})
.on('error', function (error) { console.error(error) })
.on('complete', function() {
console.log('%c' + window.location.pathname.split("/").pop() + ":", 'font-weight: bold; font-size: 14px; margin-bottom: 10px;')
this.forEach(function (trial) {
console.log('%s: %s (+- %s%)', trial.name, trial.count, trial.stats.rme)
})
}).run({ async: true })
console.log()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment