WH

RxJS - Library Picks #1

Rxdeep

For the easier determination of a value change inside a deeply nested object, use Rxdeep's state's output observable for wrapping an object to subscribe to the change events.

import { state } from 'rxdeep';
 
const s = state([ { name: 'John' }, { name: 'Jack' }, { name: 'Jill' } ]);

// Listen to changes on 'name' property of index 1 on the list:
s.sub(1).sub('name').subscribe(console.log);     // --> logs `Jack`

RxJs Debug

Wrap a RxJS observable to log out the pipe operator's actions along with phase changes of the observable in a consolidated manner.

// a simple observable
const source = of(1);
 
// wrap it with rxjs-debug
// you can also provide an optional id to identify the Observable
$D(source, {id: 'Special'}) // returns a copy of the original Observable with logging enabled
  // apply operators on it (optional)
  .pipe(
    map(x => x + 5),
    switchMap(x => of(x * 2)),
    delay(200)
  )
  .subscribe(); // activate the stream

/*
// Output
Special >> SUBSCRIBED--------------------▼
Special >> START
0 source      1 
1 map         6 
2 switchMap   12 
3 delay       12 
Special >> END‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾△
Special >> COMPLETED---------------------▲
*/