Skip to content
React Redux, but just up to 98x faster. (Forked from 6.0) Make React Redux great again!
Branch: master
Clone or download
Latest commit d13a494 Mar 15, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/ISSUE_TEMPLATE
docs
src
test Delete package-lock.json Mar 11, 2019
website Fix spacing issues (#1153) Jan 2, 2019
.babelrc.js
.eslintignore Initial import from gaearon/redux Jul 11, 2015
.eslintrc Use Prettier (#1071) Nov 6, 2018
.gitignore
.prettierrc Add `connect()` API doc (#1140) Dec 23, 2018
.travis.yml
CHANGELOG.md fix missing exports Mar 15, 2019
CODE_OF_CONDUCT.md Initial import from gaearon/redux Jul 11, 2015
CONTRIBUTING.md
LICENSE.md Copyright year range Jan 6, 2017
README.md Update README.md Mar 15, 2019
codecov.yml isparta is dead. And use Codecov. Aug 16, 2016
context.md Update context.md Mar 12, 2019
package-lock.json
package.json bump version 6.5.2 Mar 15, 2019
rollup.config.js

README.md

React Redux Fork

React Redux, but just up to 98x faster. (Forked from 6.0)

Installation

React Redux Fork requires React 16.6 or later.

npm install --save react-redux-fork

Using with yarn alias

yarn add react-redux@npm:react-redux-fork

Fast upgrade with alias your packages.json with yarn alias

"react-redux": "npm:react-redux-fork@^6.5.2"

React Native

npm install --save react-redux-fork-native

Benchmark

Done with official tool : https://github.com/reduxjs/react-redux-benchmarks

Results for benchmark deeptree: FPS Avg : 2.20x - Render Avg : 2.20x

┌────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬──────────────────────┐
│ Version    │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values           │
│            │         │ (Mount, Avg) │           │           │          │                      │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────┤
│ 6.0.0      │ 27.00   │ 68.91, 1.96  │ 5925.95   │ 2423.24   │ 1028.30  │ 27,27                │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────┤
│ 6.5.0-fork │ 59.26   │ 65.97, 0.89  │ 2836.54   │ 3903.35   │ 2043.18  │ 59,60,59,60,59,60,60 │
└────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴──────────────────────┘

Results for benchmark forms: FPS Avg : 1.00x - Render Avg : 9.00x

┌────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬────────────────────────────┐
│ Version    │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                 │
│            │         │ (Mount, Avg) │           │           │          │                            │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼────────────────────────────┤
│ 6.0.0      │ 54.33   │ 752.01, 1.35 │ 3165.75   │ 275.90    │ 853.41   │ 53,55,56,54,55,51,51       │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼────────────────────────────┤
│ 6.5.0-fork │ 54.99   │ 752.70, 0.15 │ 1488.76   │ 260.11    │ 938.07   │ 58,55,54,55,54,55,54,55,55 │
└────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴────────────────────────────┘

Results for benchmark stockticker: FPS Avg : 2.05x - Render Avg : 14.00x

┌────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬─────────────────────────┐
│ Version    │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values              │
│            │         │ (Mount, Avg) │           │           │          │                         │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────┤
│ 6.0.0      │ 28.82   │ 129.28, 4.05 │ 7540.88   │ 1712.85   │ 547.74   │ 30,29,28,29,28,29,28,28 │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────┤
│ 6.5.0-fork │ 59.35   │ 130.42, 0.29 │ 4144.02   │ 3913.76   │ 1455.73  │ 60,59,60,59,59          │
└────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴─────────────────────────┘

Results for benchmark tree-view: FPS Avg : 1.15x - Render Avg : 98.70x

┌────────────┬─────────┬───────────────┬───────────┬───────────┬──────────┬────────────────────────────┐
│ Version    │ Avg FPS │ Render        │ Scripting │ Rendering │ Painting │ FPS Values                 │
│            │         │ (Mount, Avg)  │           │           │          │                            │
├────────────┼─────────┼───────────────┼───────────┼───────────┼──────────┼────────────────────────────┤
│ 6.0.0      │ 44.55   │ 348.76, 12.83 │ 5351.81   │ 2675.88   │ 93.59    │ 46,52,40,43,52,37,39,38,38 │
├────────────┼─────────┼───────────────┼───────────┼───────────┼──────────┼────────────────────────────┤
│ 6.5.0-fork │ 50.89   │ 348.82, 0.13  │ 1974.17   │ 4291.97   │ 164.02   │ 50,57,49,48,49,51,54,49,49 │
└────────────┴─────────┴───────────────┴───────────┴───────────┴──────────┴────────────────────────────┘

Results for benchmark twitter-lite: FPS Avg : 1.03x - Render Avg : 12.70x

┌────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬─────────────────────────┐
│ Version    │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values              │
│            │         │ (Mount, Avg) │           │           │          │                         │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────┤
│ 6.0.0      │ 56.91   │ 2.17, 1.91   │ 7469.43   │ 654.56    │ 127.39   │ 59,60,59,58,53,48,48    │
├────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────┤
│ 6.5.0-fork │ 59.38   │ 2.21, 0.15   │ 2271.48   │ 874.72    │ 141.36   │ 59,60,59,60,59,60,59,59 │
└────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴─────────────────────────┘

Abstract

If you are reading this page, probably you already know that React-Redux 6.x performance aren't very good. IMHO, this is due to some technical errors:

  1. use new React 16 Context to propagate Store value: React Context is very slow, and the common use is the propagation of values that rarely change like theme or language
  2. use of <ReactReduxContext.Consumer> {value=>.... to read value of store : => render prop pattern, even if is a common and easy to use react pattern is slow

This fork use the new React Context only for propagate store instance, and do not use Context.Consumer render Prop.

These optimizations require to bump react version to 16.6 (but if you are using React 16.4 should be safe upgrade to 16.6)

In summary, react-redux-fork restore the performance of react-redux 5.x without Warnings for deprecated React lifycicles and legacy Context, (React 17 ready) and in some use cases is faster than old 5.x due React batched updates, that batched setState to do them in Top-Down mode.

Differences from React-Redux 6.0.0

  • React version > 16.6 instead of 16.4
  • Direct use of <ReactReduxContext.Consumer> { storeValue => ... is no more supported, too slow. use connect instead.
  • using context prop on connected components is not recommended. Instead use connect(..., options.context:MyCustomContext) if you need custom context (rarely use-case, like libs). Read more about react-redux and context prop here: https://github.com/salvoravida/react-redux-fork/blob/master/context.md

Why not just a PR to official react-redux project?

Of Course i have done this before doing a fork, but rr manteiners do not seem to be opened to performances fixes :D

Luckily it's an open source project!

Note

Someones think that "you may do not need Redux", and that's true for small apps, but if you need it, you are probably working on a large enterprise app, so not only you need Redux, but you need it with the best possible performances! That's why i decide to fork this project.

redux-first-history

If you need performances, i would like to suggest you to have a look to this project https://github.com/salvoravida/redux-first-history In summary, replace "connected-react-router" with "redux-first-history" to get benefits from the best possible Redux approach:

  • one way data-flow
  • one unique source of truth

Feedback

Let me know what do you think!
Enjoy it? Star this project! :D

Contributors

See Contributors.

License

MIT

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.