diagon

Diagon

State-management designed to minimize renders while staying out of your way and letting you write natural mutable code without sacrificing object references.

npm install diagon diagon-react # core and react bindings

Full React sandbox here and sample app here

Read the Full Documenation

diagon

Object change recording
Property change subscriptions
Mutable coding style
Object graphs with shared references
Cyclic references
Map, Set, and Array
Time travel with undo/redo built-in
Transparent to 3rd party libraries

diagon-react

Re-renders components only if state changes
Prevents parent re-renders
Async mutation with rendering control
Allows almost all your components to be wrapped in React.Memo
React 18 support with useSyncExternalStore
Render batching
Concurrent Mode (may work but needs testing)

Library Comparison

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.

React

*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.