A side-by-side comparison of Angular state management libraries
Clone or download
Latest commit 150eb7d Sep 6, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
ngrx chore: code formatting Apr 8, 2018
ngxs Updating rxjs to 5.6.0-forward-compat.3 Apr 22, 2018
.gitignore chore: code formatting Apr 8, 2018
.prettierrc working ngrx demo Apr 8, 2018
README.md Correct link Sep 6, 2018

README.md

One Framework - Two State Management Libraries

Here we have two Angular apps that are - from the end user's presepective - identical in every way.

But from the developer's prespective there is a world of difference. I'm not taking sides here - just want to give you a balanced side-by-side comparison of NGXS and NgRx.

Watch the video and read the article.

Usage

cd ngxs && npm i
cd ngrx && npm i

How do I compare the code footprint between projects? Here's a simple formula:

( {NgRx}.reducer.ts + {NgRx}.effects.ts ) ≈ {NGXS}.state.ts

Both projects have action classes defined in *.actions.ts files

Also, take a look at salad-page.component.ts to compare state selectors between libraries.

Benchmarks

Webpack bundle analyzer

cd ngxs && npm run analyzer
cd ngrx && npm run analyzer