Dans le monde des gestionnaires d'états, il est bien souvent difficile de choisir, même avec le framework Angular 21 ! Les plus connus : ngrx, puis ngxs, ou bien le plus jeune akita ... Et voilà quelques années, depuis l'arrivée des signaux, une nouvelle librairie est apparue : ngrx signal. Emmenant encore plus de flou dans le choix à faire.

ngrx - la librairie robuste et historique

La librairie utilise rxjs (ng rx). Et donc tout fonctionne avec les Observables. 

C'est un avantage énorme pour des applications historiques, qui ne sont pas encore passées aux signal, à zoneless.

On parle ici de code legacy, de projets qui tournent encore en angular 14, ou même moins. 
D'ailleurs le projet peut être en angular 21 (dans sa version) et garder l'archi, les modules, les habitudes de l'ancienne version du framework angular.

L'architecture

C'est l'un des points forts, et l'un des points faibles de ngrx : son architecture.

On y trouve : 

- des reducers
- des actions
- des selectors
- le store
- des effects (pas les effects du l'api signal d'angular 15+)

L'architecture respecte les principes de l'architecture DataFlow : https://fr.wikipedia.org/wiki/Architecture_Dataflow. 

L'idée étant d'avoir aucun effet de bord de l'architecture et de séparer l'émission des informations de la mise en place de la mise à jour.

Le point le difficile dans l'appréhension de l'architecture de NgRx, c'est l'orchestration des différents design pattern (Observer, Mediator, Bus Event, ...).

Forces et faiblesses

La force de cette architecture c'est l'indépendance des responsabilités ! 

On a un composant qui va appeler un service.
Ce service va dispatch une action,  grâce au dispatcher ngrx depuis le Store.
Cette action peut déclencher la mise à jour de N états en même temps ! 

Et je ne parle même pas des effects ngrx qui peuvent eux aussi réagir suivant l'action en cours !

La surprise

Le savais-tu ? La librairie ngrx s'est mise à jour en prenant en compte les signals ! 
On peut maintenant passer d'un store full Observable à une conversion vers les Signal ! 

ngrx signals - La petite soeur qui prend de l'ampleur

Depuis l'avènement des signal dans angular (depuis angular 14 +), l'équipe de ngrx a décidé de sortir une librairie, ngrx signal, qui repense complètement l'approche du store, et du gestionnaire d'état, façon signal.

De base ngrx signal propose la création d'un store, qui est pensé pour accompagner les composants.

L'intérêt, c'est qu'on peut aussi le penser, et l'utiliser, aussi comme un store globale.

L'architecture

ngrx signal c'est le : TOUT en UN.

Tout est intégré dans le store :

- Les méthodes de mise à jour : à ajouter soit même
- Les computed pour apporter des signal calculés supplémentaires
- Les méthodes de créations de signaux connectés : les linked signals appliqués au signal store.

A cette étape : finie l'architecture Data-Flow !

Forces et faiblesses

La force que beaucoup ont ressenti : un seul endroit pour tout faire, fini la complexité de l'architecture vécu dans ngrx !

La faiblesse majeure : tout est au même endroit (dans les fondamentaux, car on peut créer des feature spécifiques).

Et l'autre faiblesse, c'est ... la disparition de la partie Action, et des reducers !

Retour des reducers

Selon moi, il manquait vraiment la possibilité d'avoir l'architecture basée sur les actions ! 

Heureusement, l'équipe de ngrx a comblé ce manque depuis une version (depuis angular 20).

Il s'agit des events ! 

On peut maintenant dispatch des events, utiliser des reducers pour organiser logiquement les impacts sur nos états !

Laquelle choisir, le résumé 

Si tu as un projet légacy, qui n'est pas passé à angular 20,21, qui n'utilise pas les signals, clairement, ngrx est ton choix privilégié.

Mais tu vas devoir apprendre l'architecture DataFlow / Reduc-flux.

Si ton projet est orienté signal, là tu as deux choix ; garder la puissance de ngrx, et utiliser les interops vers les signals que propose ngrx.

Ou bien, tu peux partir sur l'archi events avec signal store, si ton projet prend de l'ampleur.
Ou bien rester dans uen archi simple ngrx signal store sans events ni dispatcher, ni reducers !


----
Et si tu le souhaite, on propose des formations pour apprendre ngrx et ngrx signal : 
- https://www.devtobecurious.fr/formations-developpeur/front-end/angular-19-etat-ngrx-signals
- https://www.devtobecurious.fr/formations-developpeur/front-end/angular-19-avance