Flush state with an NgRx meta-reducer

Use case

You want to (partially) flush the state.

Solution

Use a meta-reducer to listen to an action and flush the state by invoking the reducer with the undefined state so the reducers re-use their initial state.

Download • Share
/**
 * Reset the whole state when the RESET action is dispatched
 */
function flush(reducer) {
  return function (state: AppState | undefined, action: Action) {
    if (action.type === 'RESET') {
      return reducer(undefined, action);
    }

    return reducer(state, action);
  };
}

/**
 * Reset a partial state when the RESET action is dispatched,
 * except for the authentication and design states
 */
function flush(reducer) {
  return function (state: AppState | undefined, action: Action) {
    if (action.type === 'RESET') {
      return reducer(
        {
          authentication: state.authentication,
          design: state.design,
        },
        action,
      );
    }

    return reducer(state, action);
  };
}

Reduce memory usage of .NET services on a single machine

Use case

You see the memory consumption of multiple services growing and it doesn't decrease over time. After profiling the service you notice the memory of the service is released (there's no memory leak), but the unmanaged memory keeps on growing.

The Solution

When multiple containerized .NET API's are published on one machine, it might be more performant to disable the server garbage collection. This might lead to more CPU usage (in our case this wasn't the case, or it was very minimal), but it will help to reduce the memory usage.

See the docs for more details.

Project.Api.csproj • Download • Share
<Project Sdk="Microsoft.NET.Sdk.Web">
  <PropertyGroup>
    <TargetFramework>net5.0</TargetFramework>
    <ServerGarbageCollection>false</ServerGarbageCollection>  </PropertyGroup>
</Project>

Show stacktrace when dotnet core API doesn't start

Use case

When you have an API that doesn't start and doesn't show an error log.

Solution

Update the web.config and set the ASPNETCORE_DETAILEDERRORS environment variable to true.

Download • Share
<system.webServer>
  <httpErrors errorMode="Detailed" />
  <aspNetCore processPath="dotnet">
    <environmentVariables>
      <environmentVariable name="ASPNETCORE_DETAILEDERRORS" value="true" />
    </environmentVariables>
  </aspNetCore>
</system.webServer>

Polling with a NgRx Effect

Use case

You want to periodically the refresh data in the NgRx Store.

Solution

Create a NgRx Effect that retrieves the data via a service every x minutes, this can be done with the RxJS timer operator.

Download • Share
refresh$ = createEffect(() => {
  // every 10 minutes
  return timer(0, 600000).pipe(
    switchMap(() =>
      this.customersService.get().pipe(
        map((data) => refreshSuccess(data)),
        catchError((response) => refreshFailed(response)),
      ),
    ),
  )
})

Destructure an object to remove a property

Use case

I want to delete a property from an object in a pure (immutable) way.

Solution

Use a destructuring assignment to assign the to be removed property to a variable, while cloning the "rest" properties to a new variable. The _ is used to prevent a linter giving the warning "variable is declared but its value is never read".

Download • Share
const { password: _, ...user } = {
  id: 47,
  username: 'tim',
  password: 'iliketrains',
}

console.log(user)
// |> { id: 47, username: 'tim' }

For more examples see Destructuring assignment on MDN

Multiple service calls from an Effect

Use case

An action to fetch multiple entities at once, but the service has only an endpoint to fetch one entity at a time.

Solution

Use the RxJS merge operator to flatten all request streams and concurrently emit all values to a single output stream.

Download • Share
refresh$ = createEffect(() =>
  this.actions$.pipe(
    ofType(CustomerActions.refresh),
    exhaustMap(({ customerIds }) =>
      merge(
        ...ids.map((id) =>
          this.customersService.getCustomer(id).pipe(
            map(CustomerActions.getCustomerSuccess),
            catchError((err) =>
              of(CustomerActions.getCustomerFailed(id, err.message)),
            ),
          ),
        ),
      ),
    ),
  ),
)