BT

RxJS 6 Release Improves Performance and Modularity

| by Dylan Schiemann Follow 5 Followers on May 16, 2018. Estimated reading time: 2 minutes |

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.

Rate this Article

Adoption Stage
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread
Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Discuss

Login to InfoQ to interact with what matters most to you.


Recover your password...

Follow

Follow your favorite topics and editors

Quick overview of most important highlights in the industry and on the site.

Like

More signal, less noise

Build your own feed by choosing topics you want to read about and editors you want to hear from.

Notifications

Stay up-to-date

Set up your notifications and don't miss out on content that matters to you

BT