Library Comparison
tip
This comparison strives to be as accurate and as unbiased as possible. If you use any of these libraries and feel the information could be improved, feel free to suggest changes.
Diagon | Immer | Zustand | Zustand+Immer | |
---|---|---|---|---|
Object change tracking | ✅ | ✅ | ✅ | ✅ |
Mutable coding style | ✅ | ✅ | 🟥 | ✅ |
Object Patch Production | ✅ | ✅ | 🟥 | ✅ |
Javascript references | ✅ | 🟥 | 🟥 | 🟥 |
Object graphs with shared references | ✅ | 🟥 | 🟥 | 🟥 |
Cyclic references | ✅ | 🟥 | 🟥 | 🟥 |
Mutable state | ✅ | 🟥 | 🟥 | 🟥 |
Immutable state | 🟥 | ✅ | ✅ | ✅ |
Rich query selectors | ✅ | 🟥 | 🟥 | 🟥 |
Property change subscriptions | ✅ | 🟥 | ✅ | ✅ |
Async | ✅ | ✅ | ✅ | ✅ |
Map, Set, and Array | ✅ | ✅ | ✅ | ✅ |
Time travel with undo/redo | ✅ | ✅ | 🟥 | ✅ |
Performance* | 2x-8x | 1x | TBD | TBD |
React
Diagon | Zustand | |
---|---|---|
Re-renders components only if state changes | ✅ | ✅ |
Works with or without React Context | ✅ | ✅ |
Patch recording hooks | ✅ | 🟥 |
*Benchmark results here. Diagon performs consistenly 2x-8x faster than Immer even without Immer patch support enabled. Note, of course, that any benchmarks should simply be treated as a data point and will never be a substitue for real-world profiling. Suggestions and improvements to them are very welcome. A React benchmark on js-framework-bench pull request is pending.