rp with rxjs .pdf

File information


Original filename: rp_with_rxjs.pdf
Title: rp_with_rxjs

This PDF 1.3 document has been generated by PowerPoint / Mac OS X 10.10.5 Quartz PDFContext, and has been sent on pdf-archive.com on 21/10/2016 at 15:36, from IP address 74.76.x.x. The current document download page has been viewed 922 times.
File size: 4.5 MB (30 pages).
Privacy: public file


Download original PDF file


rp_with_rxjs.pdf (PDF, 4.5 MB)


Share on social networks



Link to this file download page



Document preview


GETTING STARTED WITH
REACTIVE PROGRAMMING
& RxJS
ZACK FANTAUZZI

LEAD FRONT-END ENGINEER with RAILROAD19 (RAILROAD19.COM)
FANTAUZZI@RAILROAD19.COM
GIVEN ON OCTOBER 18TH, 2016 TO THE GDG CAPITAL REGION
http://www.meetup.com/google-developer-group-of-the-capital-region/

REACTIVE PROGRAMMING
In computing, reactive programming is a programming paradigm
oriented around data flows and the propagation of change.
— Wikipedia, https://en.wikipedia.org/wiki/Reactive_programming

Reactive Programming > Concepts

CONCEPTS
• Everything is a stream of data





Click, Drag, Focus, Blur, etc (events)
Collections (arrays)
Network Requests and Responses
Variables

• Compose chains of operators to react to streams
• Pushing changes vs polling for changes



New values/changes are published
Subscribers (1 or more) receive the changes and act accordingly

• An application is a collection of aysnc events and state changes

3

Reactive Programming > Patterns

PATTERNS
• Reactive programming combines two fundamental patterns:



The Observer Pattern
The Iterator Pattern

• The Observer Pattern:

Listeners register themselves to a Producer and the Listeners
are notified by the Producer of state changes

• The Iterator Pattern:

Consumers of an Iterator can progress and return values (next()) and
check if the Iterator has more values remaining (hasNext())

• The Reactive Pattern:

A Producer (Observable) emits it’s updates in sequence to
it’s Subscribers (Observer) and the Subscribers react to those updates

4

Reactive Programming > The Case for Reactive Programming

THE CASE FOR REACTIVE PROGRAMMING
• Reduce the time spent implementing the management of:





User behavior (clicks, saving, typing, focusing, deleting, etc)
CRUD — interacting with local state and server state
Business logic
etc

• Allows for more time implementing business logic
• Additional power comes from the ability to:



Combine streams (synchronous and asynchronous)
Apply ‘operators’ to the streams (map, reduce, flatMap, filter, etc)

• Makes your code more declarative and composable
• Fits nicely with modern web applications (PWAs, Real-time, etc)

5

VISUALIZING REACTIVE SEQUENCES
If you can’t draw it, you don’t understand it.

Visualizing Reactive Sequences > Marble Diagrams

MARBLE DIAGRAMS
• Just like traditional UML diagrams
(Swim-lane, Sequence, Interaction, etc)
• Marble diagrams offer a great way to illustrate the concept of:
value over time
• Here is the ‘academic’ marble diagram created by the Rx team:

7

Visualizing Reactive Sequences > Marble Diagrams: map()

8

MARBLE DIAGRAMS
Example 1: map()
1

2

3

map(x => 1.5 * x)

1.5

3

4.5

Visualizing Reactive Sequences > Marble Diagrams: debounce()

9

MARBLE DIAGRAMS
Example 2: debounce(time) OR debounceTime(time)   via  RxJS5
1

2

3

4

5

6

7

debounce(10)

1

5

7


Related documents


rp with rxjs
datastructuresnotes
genetic algorithms
crpitv102nguyen
03 569 970 1 sm
c

Link to this page


Permanent link

Use the permanent link to the download page to share your document on Facebook, Twitter, LinkedIn, or directly with a contact by e-Mail, Messenger, Whatsapp, Line..

Short link

Use the short link to share your document on Twitter or by text message (SMS)

HTML Code

Copy the following HTML code to share your document on a Website or Blog

QR Code

QR Code link to PDF file rp_with_rxjs.pdf