3. Callback Hell…
app.get('/index', function (req, res, next) {
User.get(req.params.userId, function (err, user) {
if (err) next(err);
db.find({user: user.name}, function (err, cursor) {
if (err) next(err);
cursor.toArray(function (err, items) {
if (err) next(err);
res.send(items);
});
});
});
});
…and the Pyramid of Doom
4. The promise of a better future…
tweetsAsync()
.then(function (a) { return usersAsync(a); })
.then(function (b) { return locationAsync(b); })
.done(function (c) { render(); });
5. What about events?
• What about composition?
• How do I clean up handlers?
• How do I merge streams?
• Or filter?
• Or aggregate?
• Without having a lot of state hanging around?
• The list goes on and on…
7. What is it?
• RxJS is…
• a set of types representing asynchronous data streams
• a set of operators over asynchronous data streams
• a set of types to parameterize concurrency
RxJS = Observables + LINQ + Schedulers
12. var sequence = '38,38,40,40,37,39,37,39,66,65';
var keyups = Rx.Observable.fromEvent(document, 'keyup')
.select(function (x) { return x.keyCode; })
.bufferWithCount(10, 10)
.subscribe(function (x) {
var matches = x.join() === sequence;
if (matches) console.log('Konami');
});
13. What is it?
• RxJS is…
• a set of types representing asynchronous data streams
• a set of operators over asynchronous data streams
• a set of types to parameterize concurrency
RxJS = Observables + LINQ + Schedulers
14. The Essentials…
Observer = {
onNext :
function (data) { … }, Observable = {
onError : subscribe :
function (error) { … }, function (observer) { … }
onCompleted : };
function () { … }
};
Observable
Subscribe
Observer
15. The Grammar Police…
• Zero or more values
* ( OnError | OnCompleted ) ?
• E.g. events are ∞ sequences
0 1 2
0 1
• It’s a sequence
0 1 2 • No concurrent
callbacks
• One time termination
0 1 2
17. What?
• RxJS is…
• a set of types representing asynchronous data streams
• a set of operators over asynchronous data streams
• a set of types to parameterize concurrency
RxJS = Observables + LINQ + Schedulers
18. If you know ES5 Array “extras”…
Array Observable
• Querying • Querying
• concat • concat
• every • all
• filter • where
• map • select
• reduce • aggregate
• some • any
• Subscribing • Subscribing
• forEach • subscribe
… then you know RxJS
19. Querying Asynchronous Streams
• Observables are data streams
• Hence we can query them like we do with Arrays!
function
return
28. Time based operators
delay
interval
throttle
timeout
timeInterval
timer
timeStamp
29. What?
• RxJS is…
• a set of types representing asynchronous data streams
• a set of operators over asynchronous data streams
• a set of types to parameterize concurrency
RxJS = Observables + LINQ + Schedulers
30. The Role of Schedulers…
Many
implementations
• Key questions:
Cancellation
• How to run timers?
• Where to produce events? d = scheduler.schedule(
function () {
• Need to synchronize with the UI?
// Asynchronously
// running work
• Providing one answer: },
• Schedulers introduce concurrency 1000);
• Operators are parameterized by schedulers Optional time
• Provides test benefits as well
31. var scheduler = new TestScheduler();
var input = scheduler.createColdObservable(
onNext(300, "Cascadia"),
onNext(400, "JS"),
onCompleted(500));
var results = scheduler.startWithCreate(function () {
input.select(function (x) { return x.length; })
});
results.messages.assertEqual(
onNext(300, 8),
onNext(400, 2), Testability is King!
onCompleted(500));
32. Start using it now
Node.js
> npm install rx
NuGet
> Install-Package RxJS
Open Source
http://rx.codeplex.com/
33. What’s Next?
• Ongoing work
• Documentation
• Tutorials
• Where’s the vision?
• Scaling
• Distributed
• Merge with Node.js Streams