combine/compose (ngrx core) vs createSelector (reselect)

Per ngrx eg. app :ngrx.github.io/example-app/

  • Use Combine to combine reducers for meta-reducers
  • Use createSelector to compose State. OR use compose (ngrx core) for it hence removing dependency on reselect

 

DOCS:

  • compose:
  •  combineReducers
    • is another useful metareducer that takes a map of reducer functions and creates a new reducer that gathers the values of each reducer and stores them using the reducer’s key. Think of it almost like a database, where every reducer is a table in the db.
      More: https://egghead.io/lessons/javascript-redux-implementing-combinereducers-from-scratch

    • Because metareducers take a reducer function and return a new reducer,
      * we can use our compose helper to chain them together. Here we are
      * using combineReducers to make our top level reducer, and then
      * wrapping that in storeLogger. Remember that compose applies
      * the result from right to left.
  • createSelector
    • Every reducer module exports selector functions, however child reducers
      * have no knowledge of the overall state tree. To make them useable, we
      * need to make new selectors that wrap them.
      *The createSelector function from the reselect library creates
      * very efficient selectors that are memoized and only recompute when arguments change.
      * The created selectors can also be composed together to select different
      * pieces of state.
    • * Some selector functions create joins across parts of state. This selector
      * composes the search result IDs to return an array of books in the store.
      */
      export const getSearchResults = createSelector(getBookEntities, getSearchBookIds, (books, searchIds) => {
      return searchIds.map(id => books[id]);
      });

You don’t need reselect

The select() method will give you an observable that calls distinctUntilChanged() internally, meaning they will only fire when the state actually changes. ( it means when there is a new reference ).

ref: https://netbasal.com/querying-a-normalized-state-with-rxjs-in-angular-71ecd7ca25b4

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s