https://github.com/codediodeio/ngrx-vs-ngxs
A side-by-side comparison of Angular state management libraries
https://github.com/codediodeio/ngrx-vs-ngxs
Last synced: 3 months ago
JSON representation
A side-by-side comparison of Angular state management libraries
- Host: GitHub
- URL: https://github.com/codediodeio/ngrx-vs-ngxs
- Owner: codediodeio
- Created: 2018-04-08T16:55:42.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2018-09-06T14:44:39.000Z (almost 7 years ago)
- Last Synced: 2025-04-15T06:14:53.730Z (3 months ago)
- Language: TypeScript
- Size: 127 KB
- Stars: 122
- Watchers: 6
- Forks: 41
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 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](https://angularfirebase.com/lessons/ngxs-quick-start-angular-state-management).
## 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
```