Store Management in React / Angular such as Redux / NgRx


Store Management

  •  A Store (state) management library (such as Redux, Angular-Redux, NgRx etc.) gives you a convenient way to Model your application state, derive computed values from it, Monitor it for changes.
  • Store management solves the extraneous props / inputs issue in components hierarchy. If we try to solve those scenarios with event emitters like Angular @Input() / @Output(), we will easily end up with event soup scenarios, where the events chain themselves in unexpected ways, and it becomes hard to reason about the application.
  • It solves the problem of component interaction via the Observable pattern
  • It provides a client-side cache if needed, to avoid doing repeated Ajax requests
  • It provides a place to put temporary UI state, as we fill in a large form or want to store search criteria in a search form when navigating between router views
  • It solves the problem of allowing modification of client side transient data by multiple actors          
  • Characteristics of Store management:

o   Single source of truth (It improves development scalability, maintainability and debugging and enables you to persist your app’s state in development, for a faster development cycle)
o   State is read-only - The only way to change the state is to emit an action, an object describing what happened.
o   State is immutable - Remember to return new state objects, instead of mutating the previous state. We can also get previous states of an object.

Comments

Popular posts from this blog

JavaScript - ES2015 (aka ES6)

Data Bound Controls in ASP.Net - Part 4 (FormView and DetailsView controls)

The Clickjacking attack and X-Frame-Options