CSP IN JAVASCRIPT.

Transcription

1 CSP IN JAVASCRIPT Page 1 of 31

2 VINCENZO CHIANESE BUGS INTRODUCER AT APIARY Page 2 of 31

3 COMMUNICATING SEQUENTIAL PROCESSES Page 3 of 31

4 THE PROBLEM: SHARING THE MEMORY Non determinism Race conditions Deadlocks Hard to reproduce Hard to debug Hard to test Page 4 of 31

5 SOLUTIONS Mutexes Semaphores Atomic operations...and a lot more Complexity and overhead Leaky Hard to compose Page 5 of 31

6 Wait a moment...! Page 6 of 31

7 We're using Javascript! Problem solved. - Any of you, now Page 7 of 31

8 HIGH LEVEL TASKS EXAMPLE Ajax request - 1, 2, 3, 4 Rendering - 1, done! 1 2 done! " done! 3 4 done! # Page 8 of 31

9 COORDINATION OF CONCURRENCY Page 9 of 31

10 Callbacks function publish() { getproduct('f010', function (err, product) { if (err) handleerror(err); else getproductsales(product, function (err, sales) { if (err) handleerror(err); else publishsales(sales, function (err, res) { if (err) handleerror(err); else { // Do finally something useful } }); }); }); } Page 10 of 31

11 Page 11 of 31

12 Promises function publish() { return getproduct('f010').then(getsales).then(publissales).then(undefined, handleerror); } Page 12 of 31

13 Generators co(function* publish() { try { const product = yield getproduct('f010'); const sales = yield getsales(product); yield publishsales(sales); } catch (e) { handleerror(e); } }); Page 13 of 31

14 Async async function publish() { try { const product = await getproduct('f010'); const sales = await getsales(product); await publishsales(sales); } catch (e) { handleerror(e); } } Page 14 of 31

15 PROMISES STILL HAVE SOME LIMITATIONS Page 15 of 31

16 Promises and events const p1 = new Promise((resolve, reject) => { $('#btn').on('click', (evt) => { const classname = evt.target.classname; if (classname === "tinapacchetella") { resolve(classname); } else { reject(); } }); }); p1.then((classname) => alert(classname)); Demo Page 16 of 31

17 Promises and events $('#btn2').on('click', (evt) => { const p1 = new Promise((resolve, reject) => { const classname = evt.target.classname; if (classname === "tinapacchetella") { resolve(classname); } else { reject(); }; }); p1.then((classname) => alert(classname)); }); Demo Page 17 of 31

18 High order pattern Observable (RxJs) Communicating Sequential Processes Page 18 of 31

19 Pipes They are simple cat file grep search They are composable They are parallel It does not leak Page 19 of 31

20 C.S.P. COMMUNICATING SEQUENTIAL PROCESSES <command> :.--- <simple command>l<structured command> <simple command> :.--- <null command>l<assignment command> I<input command>l<output command> <structured command> :.--- <alternative command> I<repetitive command>l<parallel command> <null command> :.--- skip <command list> :.--- {<declaration>; I<command>;} <command> Original paper 1978 Page 20 of 31

21 PROCESSES No OS processes They do not share memory Page 21 of 31

22 CHANNELS Pass data structures Instrinsic configurable blocking mechanism Page 22 of 31

23 ONE TO ONE Page 23 of 31

24 ONE TO MANY Page 24 of 31

25 MANY TO ONE Page 25 of 31

26 MANY TO MANY Page 26 of 31

27 Time to code! Basic home made example CSP to coordinate callbacks CSP to handle DOM events Page 27 of 31

28 CSP RECAP Solid theory concepts (it works) Simple imperative API compared to RxJs Built in backpressure Transducer support Highest order pattern Used in production (CircleCI) Page 28 of 31

29 CSP CAVEATS Idea from future Different, opinionated implementations Lack of integrations Page 29 of 31

30 Page 30 of 31

31 THANKS! Page 31 of 31