RxJS 6 Release Improves Performance and Modularity

The RxJS team has announced their 6.0 release, which improves the project's approach to modularity, streamlines performance, adds a backward compatibility package to ease upgrades, and supports code migration for TypeScript users.

To streamline migration from RxJS 5 to 6, the rxjs-compat package provides a compatibility layer between these versions.

RxJS 6 and the compatibility layer can be installed via npm:

npm install rxjs@6 rxjs-compat@6 --save

The compatibility shim makes it possible to upgrade to version 6 with no code changes, but developers should then update their source code to reduce the source bundle size for RxJS before deploying their applications to production.

Angular 6 users can also benefit from the RxJS schematic, making it possible to leverage Angular 6's ng update mechanism which will automatically install rxjs-compat into an application.

Module import paths were reorganized into several categories:

• rxjs: Creation methods, types, schedulers, and utilities
• rxjs/ajax: RxJS HTTP request implementation
• rxjs/operators: Pipeable RxJS operators
• rxjs/testing: RxJS testing utilities
• rxjs/webSocket: RxJS WebSocket implementation

TypeScript users of RxJS are encouraged to use rxjs-tslint which will help refactor import paths from version 5 to 6.

The other significant change in RxJS is the transition to using a pipeable API for its operators. Previously RxJS provided chaining which would patch the prototype operator, but this introduced challenges as it was global, challenging to optimize for webpack's tree-shaking capabilities, and challenging for linting tools.

For example, the following is an RxJS 5 example:

source
  .map(x => x + x)
  .mergeMap(n => of(n + 1, n + 2)
    .filter(x => x % 1 == 0)
    .scan((acc, x) => acc + x, 0)
  )
  .catch(err => of('error found'))
  .subscribe(printResult);

In RxJS 6, it changes to:

source.pipe(
  map(x => x + x),
  mergeMap(n => of(n + 1, n + 2).pipe(
    filter(x => x % 1 == 0),
    scan((acc, x) => acc + x, 0),
  )),
  catchError(err => of('error found')),
).subscribe(printResult);

RxJS project lead Ben Lesh recently spoke about RxJS 6, providing the motivation behind the changes in the project.

RxJS is a library for reactive programming using Observables to compose asynchronous or callback-based code. Efforts have started to standardize the Observable portion of RxJS as part of a future version of JavaScript, but the Observable proposal has not yet gained traction.

RxJS is available under the Apache 2 License. Learn more at the RxJS website. Contributions are welcome via the RxJS GitHub project.