jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Redux Performance Test</title>
<!-- React and ReactDOM -->
<script src="https://unpkg.com/react/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.development.js"></script>
<!-- Redux -->
<script src="https://unpkg.com/redux/dist/redux.js"></script>
<!-- React-Redux -->
<script src="https://unpkg.com/react-redux/dist/react-redux.js"></script>
</head>
<body>
<div id="root"></div>
</body>
const { createStore } = Redux;
const { Provider, connect, useSelector } = ReactRedux;
const { useState, useEffect } = React;
const { render } = ReactDOM;
// Redux setup
const initialState = { value: 0 };
const reducer = (state = initialState, action) => {
switch (action.type) {
case 'INCREMENT':
return { value: state.value + 1 };
default:
return state;
}
};
const store = createStore(reducer);
// Component using mapStateToProps
const mapStateToProps = (state) => ({
value: state.value,
});
const ConnectedComponent = connect(mapStateToProps)(({ value }) => {
return <div>{value}</div>;
});
// Component using useSelector
const SelectorComponent = () => {
const value = useSelector((state) => state.value);
return <div>{value}</div>;
};
const rootElement = document.createElement('div');
rootElement.id = 'root';
document.body.appendChild(rootElement);
Ready to run.
Test | Ops/sec | |
---|---|---|
connect |
| ready |
selector |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.