Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Comparing global state libraries with React Hooks

NotificationsYou must be signed in to change notification settings

dai-shi/lets-compare-global-state-with-react-hooks

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 

Repository files navigation

Comparing global state libraries with React Hooks

Motivation

I have been developing several libraries for global state with React Hooks.While developing them, I was interested in comparing with existing libraries.It turns out there are various points to compare,showing characteristics of such libraries.

I started creating a comparison table inthe issue.As the table becomes bigger, let's create a separate reposo that library authors can contribute improving the comparison.

Comparison points

  1. Does it use React Context? What is context value?
  2. Does it use subscription for state propagation?
  3. Does it have render optimization? What is the technique?
  4. Does it have dependencies? What are they?
  5. What's the level of compatibility with concurrent rendering?
  6. Bundle size (Minified + Gzipped)

Notes

Render optimization means avoiding unnecessary re-renders.If a state object is{ a: 1, b: 2 } and a component only usesa,it won't re-render if onlyb is changed.

For "tearing" and "state branching", referhttps://github.com/dai-shi/will-this-react-global-state-work-in-concurrent-mode.These are not necessarily problems depending on requirements.

Comparison Table

123456
react-trackedState-based objectYesProxy-based tracking and selector functionuse-context-selector, proxy-compareLevel 31.9kB
constateState-based objectNoMultiple contextsNoLevel 3508B
unstated-nextState-based objectNoNoNoUnknown362B
zustandNoYesSelector functionNoLevel 2954B
react-sweet-stateState-based objectYesSelector functionNoUnknown3.6kB
storeonStoreYesShallow state propertiesNoUnknown370B
react-hooks-global-stateNoYesShallow state propertiesNoLevel 11.1kB
react-redux (hooks)StoreYesSelector functionReduxLevel 25.4kB
easy-peasyStoreYesSelector functionRedux, immer and so onUnknown9.6kB
mobx-react-liteMutable state objectNoProxy-based trackingMobXUnknown2kB
hookstateNoYesProxy-based trackingNoUnknown4.5kB
recoilProbably rich state-based objectYes with atom abstractionatoms (incl. selectors)NoLevel 221.1kB
react-easy-state(Note: This library does not provide Hooks API)NoYes with observerobserver@nx-js/observer-utilUnknown2.9kB
react-tagged-stateNoYesSelector function with deps trackingNoUnknown804B
agile-tsNoYesRuntime combining multiple rerender triggersNoUnknown12.7kB
jotaiStoreYes, atom-based subscriptionatomsNoLevel 1 / (Level 3)2.6kB
valtioNoYesProxy-based trackingproxy-compareLevel 22.5kB

Contribution

If you have questions, suggestions or corrections, please file an issue.

If you have a new library to add, please file a pull request. Please add a new row at the end of the table.

About

Comparing global state libraries with React Hooks

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors3

  •  
  •  
  •  

[8]ページ先頭

©2009-2025 Movatter.jp