RxJS: reaktivní programování v JavaScriptu

RxJS (Reactive Extensions for JavaScript) přináší observables, operátory a reaktivní paradigma. Klíčová závislost Angularu 2 a mocný nástroj pro asynchronní kód.

Proč reaktivní programování¶

Moderní webové aplikace jsou inherentně asynchronní — uživatelské interakce, HTTP requesty, WebSocket zprávy, timery. Callback hell a Promise chains se stávají neudržitelnými.

Reaktivní programování modeluje asynchronní data jako proudy (streams) — sekvence hodnot v čase. RxJS poskytuje nástroje pro composing, filtering a transformaci těchto proudů.

Observables a operátory¶

Observable je lazy push collection — produkuje hodnoty v čase:

import { Observable } from 'rxjs';
import { map, filter, debounceTime, switchMap } from 'rxjs/operators';

// Typeahead search
const search$ = Observable.fromEvent(searchInput, 'input')
  .pipe(
    map(e => e.target.value),
    debounceTime(300),
    filter(term => term.length > 2),
    switchMap(term => fetch('/api/search?q=' + term)
      .then(res => res.json()))
  );

search$.subscribe(results => {
  renderResults(results);
});

debounceTime čeká 300ms po posledním vstupu. switchMap zruší předchozí request při novém. Elegantní řešení komplexního problému.

RxJS v Angular 2¶

Angular 2 integruje RxJS hluboce:

• HttpClient** — vrací Observable místo Promise
• Router** — route params jako Observable
• Forms** — valueChanges jako Observable
• EventEmitter** — interně Observable

Angular tým zvolil RxJS pro jeho composability — kombinace HTTP requestů, user inputu a route changes v jednom deklarativním pipeline.

Kdy použít RxJS mimo Angular¶

RxJS není jen pro Angular — dává smysl kdekoli s komplexní asynchronní logikou:

• Real-time dashboardy** — kombinace WebSocket streamů
• Autocomplete/typeahead** — debouncing, cancellation
• Drag and drop** — composing mouse events
• Polling s retry** — interval + HTTP + error handling

Pro jednoduché fetch requesty je RxJS overkill — Promise stačí. RxJS září v komplexních asynchronních scénářích.

Závěr: mocný nástroj s učební křivkou¶

RxJS je nejpokročilejší nástroj pro asynchronní programování v JavaScriptu. Učební křivka je strmá — 200+ operátorů a nový mentální model. Ale pro komplexní real-time aplikace je návratnost investice obrovská. Začněte s jednoduchými scénáři a postupně rozšiřujte.