Save 37% off PRO during our Black Friday Sale! »

RxJS in 5 Minutes

RxJS in 5 Minutes


Aliaksei Kuncevič

June 11, 2020


  1. 5 minutes introduction in to RxJS ⏰

  2. ALIAKSEI KUNCEVIČ Independent Consultant

  3. @kuncevic Angular Minsk (BY) Frontend Tech (AU) COMMUNITY Angular

    Workshop Angular Sydney (AU) TEACHING‍
  4. @kuncevic CREATOR Aurelia vs React vs Vue vs Svelte

    vs Ember vs Elm vs Angular
  5. What is RxJS ?

  6. Reactive programming (paradigm) Rx Extensions (library, e.g RxJX) Observer

    pattern (object)
  7. Think of RxJS as 'Lodash' for handling asynchronous events.

  8. When do we use Reactive Programming?

  9. Use Cases ✅ DOM events ✅ HTTP calls ✅


  11. Rx on different platforms

  12. Rx extensions for Languages ✅ Java: RxJava ✅ JavaScript:

    RxJS ✅ C#: Rx.NET ✅ C#(Unity): UniRx ✅ Scala: RxScala ✅ Clojure: RxClojure ✅ C++: RxCpp ✅ Lua: RxLua ✅ Ruby: Rx.rb ✅ Rust: rxRust ✅ Python: RxPY ✅ Go: RxGo ✅ Groovy: RxGroovy ✅ JRuby: RxJRuby ✅ Kotlin: RxKotlin ✅ Swift: RxSwift ✅ PHP: RxPHP ✅ Elixir: reaxive ✅ Dart: RxDart
  13. Frontend Frameworks

  14. Observable vs Promise Emits multiple values over period of

    time Emits only single value at a time Lazy (Cold). Observable is not called until we subscribe for it. Not Lazy (Hot).It is executed without calling then or catch Can be canceled by calling unsubscribe Not cancellable Supports operators like map, forEach, reduce, retry, retryWhen Operators are not available We can chain observables to handle complex logic on the streams We can use only then clause Predictable error handling Pushes errors down the chain
  15. Observable Operators

  16. Observable Operators 250+

  17. Common RxJS operators Area Operators Creation from,fromEvent, of Combination

    combineLatest, concat, merge, zip, startWith , withLatestFrom Filtering debounceTime, distinctUntilChanged, filter, take, takeUntil Transformation bufferTime, concatMap, map, mergeMap, scan, switchMap Utility tap Multicasting share
  18. pipe function

  19. Combine streams

  20. .subscribe() Observables are Lazy

  21. Main Features ✅ Cancelable ✅ Predictable error handling ✅

    Extensive list of operators ✅ Guaranteed teardown of resources ✅ Keeps you away from 'callback hell'
  22. Who is using RxJS? ✅ Microsoft ✅ Google(YouTube) ✅

    Sony (PlayStation) ✅ Netflix ✅ Canva ✅ Slack ✅ Your company?
  23. Links