Slide 1

Slide 1 text

Jonathan Lipps Senior Developer Yield! Javascript Generators and Monocle.js Utah JS • 8/29/2013

Slide 2

Slide 2 text

In ES6, a bold new world awaits, ripe for the plunder of its sweet fruits!* * This is meant to be humorous. Remember kids: imperialism is bad.

Slide 3

Slide 3 text

My favorite is the generator, a new type of function whose execution can be externally controlled \

Slide 4

Slide 4 text

Generators are available in node 11 and up, by passing the --harmony ag to node \

Slide 5

Slide 5 text

Let’s have a look, shall we? \

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

Things to remember Calling a Generator returns an Iterator Iterators have a next() method Calling next() returns whatever is after the next yield statement in the generator

Slide 8

Slide 8 text

Generators allow lazy construction of potentially in nite sequences \

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

Code in generators can respond to behavior in the outside world! \

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

Things to remember next() actually returns an object, with keys value and done Calling next() with a parameter sends that value in as the result of the generator’s last yield Calling next() always returns whatever is after the next yield statement in the generator, even if you are also sending in a value

Slide 14

Slide 14 text

Hang on a minute! If we can arbitrarily pause function execution, and send values back in...

Slide 15

Slide 15 text

...we can tell the generator to wait until we’ve received the result of an asynchronous function’s callback...

Slide 16

Slide 16 text

...and avoid callback hell! We all love to hate callback hell.

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

Rightward drift

Slide 19

Slide 19 text

Repetitive error handling

Slide 20

Slide 20 text

monocle.js is a library that lets you use a blocking-like syntax with async functions in generators

Slide 21

Slide 21 text

https://github.com/jlipps/monocle-js

Slide 22

Slide 22 text

monocle.js is a port of a Python project with the same basic goal

Slide 23

Slide 23 text

https://github.com/saucelabs/monocle

Slide 24

Slide 24 text

So long, callback hell!

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

o_O takes a generator and converts it into what we call an ‘o-routine’

Slide 27

Slide 27 text

Inside an o-routine, you can: yield to another o-routine: pause execution until the other o-routine has completed return the result of this o-routine: pass a response to an o-routine waiting on us

Slide 28

Slide 28 text

monocle.launch takes an o-routine and starts executing it. You always need to kick things off this way!

Slide 29

Slide 29 text

1. Launch the main o-routine

Slide 30

Slide 30 text

2. main waits for myLibraryFunction to respond with a result

Slide 31

Slide 31 text

3. we wait for result of request

Slide 32

Slide 32 text

4. we wait for writing data to le

Slide 33

Slide 33 text

5. we wait for contents of le

Slide 34

Slide 34 text

6. we return contents of le to whoever was waiting on us

Slide 35

Slide 35 text

7. main writes out the response and execution nishes

Slide 36

Slide 36 text

But... yield? yield in generators usually acts like yield “as in crops”: it provides a result to next() yield in o-routines acts like yield “as in traffic”: it waits for something else to nish.

Slide 37

Slide 37 text

It’s easy to convert existing asynchronous functions into o-routines

Slide 38

Slide 38 text

No content

Slide 39

Slide 39 text

monocle.callback gives you a special function you pass to an async function as its callback

Slide 40

Slide 40 text

You can then yield to this special callback, and monocle will wait for it as if it were an o-routine

Slide 41

Slide 41 text

monocle.monoclize() is a helper function that makes it easy to convert async libraries to o-routines

Slide 42

Slide 42 text

No content

Slide 43

Slide 43 text

We want to monoclize Node’s fs

Slide 44

Slide 44 text

First we clone the fs object

Slide 45

Slide 45 text

Then we make a list of methods

Slide 46

Slide 46 text

Then we monoclize each one

Slide 47

Slide 47 text

CASE STUDY Appium & Yiewd

Slide 48

Slide 48 text

Appium is a mobile automation framework written in Node. It’s based on the WebDriver protocol.

Slide 49

Slide 49 text

https://github.com/appium/appium

Slide 50

Slide 50 text

WebDriver is an HTTP-based spec. Each automation command is sent over the wire.

Slide 51

Slide 51 text

Wd is a Node.js client library that implements this protocol. Appium uses Wd to write all its tests.

Slide 52

Slide 52 text

https://github.com/admc/wd

Slide 53

Slide 53 text

Wd uses Node’s HTTP libraries, which are async functions. Appium test code thus looks like this:

Slide 54

Slide 54 text

No content

Slide 55

Slide 55 text

Yiewd is a monoclized version of Wd that converts all automation functions into o-routines

Slide 56

Slide 56 text

https://github.com/jlipps/yiewd

Slide 57

Slide 57 text

Thanks to monocle, 27 lines of Wd code turns into 16 lines of Yiewd

Slide 58

Slide 58 text

No content

Slide 59

Slide 59 text

In sum, monocle.js uses JS generators to open up a whole new world of code quality

Slide 60

Slide 60 text

Join the ght! https://github.com/jlipps/monocle-js

Slide 61

Slide 61 text

Questions? @jlipps @saucelabs http://saucelabs.com/careers

Slide 62

Slide 62 text

Thanks! @jlipps @saucelabs http://saucelabs.com/careers

Slide 63

Slide 63 text

We’re Hiring! @jlipps @saucelabs http://saucelabs.com/careers