Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
CSP
Search
othree
February 14, 2015
Technology
1
190
CSP
Communicating Sequential Processes
othree
February 14, 2015
Tweet
Share
More Decks by othree
See All by othree
How GitHub Supports Vim License Detection, The Five Years Journey
othree
1
1.9k
WAT JavaScript Date
othree
3
1.9k
Modern HTML Email Development
othree
3
2.6k
MRT & GIT
othree
1
2.1k
YAJS.vim and Vim Syntax Highlight
othree
1
2.7k
Web Trends to 2015
othree
4
310
Transducer
othree
9
2.9k
HITCON 11 Photographer
othree
4
480
fetch is the new XHR
othree
6
3.5k
Other Decks in Technology
See All in Technology
バックオフィス向け toB SaaS バクラクにおけるレコメンド技術活用 / recommender-systems-in-layerx-bakuraku
yuya4
6
540
Would you THINK such a demonstration interesting ?
shumpei3
1
220
【Λ(らむだ)】最近のアプデ情報 / RPALT20250422
lambda
0
110
クラウド開発環境Cloud Workstationsの紹介
yunosukey
0
170
watsonx.data上のベクトル・データベース Milvusを見てみよう/20250418-milvus-dojo
mayumihirano
0
110
Terraform Cloudで始めるおひとりさまOrganizationsのすゝめ
handy
2
180
Рекомендации с нуля: как мы в Lamoda превратили главную страницу в ключевую точку входа для персонализированного шоппинга. Данил Комаров, Data Scientist, Lamoda Tech
lamodatech
0
730
Mastraに入門してみた ~AWS CDKを添えて~
tsukuboshi
0
240
更新系と状態
uhyo
7
1.5k
AWS全冠芸人が見た世界 ~資格取得より大切なこと~
masakiokuda
5
6k
コスト最適重視でAurora PostgreSQLのログ分析基盤を作ってみた #jawsug_tokyo
non97
0
110
ドキュメント管理の理想と現実
kazuhe
0
150
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Adopting Sorbet at Scale
ufuk
76
9.3k
Making the Leap to Tech Lead
cromwellryan
133
9.2k
Side Projects
sachag
452
42k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.5k
How GitHub (no longer) Works
holman
314
140k
Designing for Performance
lara
608
69k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.1k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Code Review Best Practice
trishagee
67
18k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.1k
Transcript
CSP othree
Communicating Sequential Processes
https://medium.com/@addyosmani/javascript-application-architecture-on-the-road-to-2015-d8125811101b
1978
1985
What is CSP • Communication between processes • Born to
be async • Using channel
Process B Process A
Process B Process A Channel msg
Process B Process A msg PUT
Process B Process A msg
Process B Process A msg TAKE
Process B Process A Channel msg
Implements Go Clojure goroutine core.async
https://speakerdeck.com/kachayev/channels-and-concurrency-go-clojure-erlang-haskell
Go Example
package main import "fmt" func main() { messages := make(chan
string, 1) messages <- "ping" msg := <-messages fmt.Println(msg) }
package main import "fmt" func main() { messages := make(chan
string, 1) messages <- "ping" msg := <-messages fmt.Println(msg) }
Short Variable Declarations • Declare variable • and assign value
at the same time :=
package main import "fmt" func main() { messages := make(chan
string, 1) messages <- "ping" msg := <-messages fmt.Println(msg) }
Receive Operator • Receive message • From channel • or
channel receive message • Also imply direction of message <-
package main import "fmt" func main() { messages := make(chan
string, 1) messages <- "ping" msg := <-messages fmt.Println(msg) }
None
Go Example II
package main import "fmt" import "time" func worker(done chan bool)
{ fmt.Print("working...") time.Sleep(time.Second) fmt.Println("done") done <- true } func main() { done := make(chan bool, 1) go worker(done) <-done }
package main import "fmt" import "time" func worker(done chan bool)
{ fmt.Print("working...") time.Sleep(time.Second) fmt.Println("done") done <- true } func main() { done := make(chan bool, 1) go worker(done) <-done }
package main import "fmt" import "time" func worker(done chan bool)
{ fmt.Print("working...") time.Sleep(time.Second) fmt.Println("done") done <- true } func main() { done := make(chan bool, 1) go worker(done) <-done }
Go Statement • Execute function as independent process(goroutine) go
None
Go Pingpong Example
package main import "fmt" import "time" type Ball struct{ hits
int } func player(name string, table chan *Ball) { for { ball := <-table ball.hits++ fmt.Println(name, ball.hits) time.Sleep(100 * time.Millisecond) table <- ball } }
package main import "fmt" import "time" type Ball struct{ hits
int } func player(name string, table chan *Ball) { for { ball := <-table ball.hits++ fmt.Println(name, ball.hits) time.Sleep(100 * time.Millisecond) table <- ball } }
player • Receive ball from channel • Hit ball(+1) •
Sleep • Send ball back
func main() { table := make(chan *Ball) go player("ping", table)
go player("pong", table) table <- new(Ball) // game on; toss the ball time.Sleep(1 * time.Second) <-table // game over; grab the ball }
func main() { table := make(chan *Ball) go player("ping", table)
go player("pong", table) table <- new(Ball) // game on; toss the ball time.Sleep(1 * time.Second) <-table // game over; grab the ball }
func main() { table := make(chan *Ball) go player("ping", table)
go player("pong", table) table <- new(Ball) // game on; toss the ball time.Sleep(1 * time.Second) <-table // game over; grab the ball }
func main() { table := make(chan *Ball) go player("ping", table)
go player("pong", table) table <- new(Ball) // game on; toss the ball time.Sleep(1 * time.Second) <-table // game over; grab the ball }
Process Channel Message players table Ball
player pong player ping table Ball
None
Key Requirement • Channel • Ability to wait(idle) message
Channel • First class object • First in first out
• Accessible across processes
Idle • Not able to idle in JavaScript • Use
recursive function call can emulate, bad performance • ES6 have async function
async function
function* foo(){ var index = 0; while (index <= 2)
// when index reaches 3, // yield's done will be true // and its value will be undefined; yield index++; }
var iterator = foo(); console.log(iterator.next()); // { value:0, done:false }
console.log(iterator.next()); // { value:1, done:false } console.log(iterator.next()); // { value:2, done:false } console.log(iterator.next()); // { value:undefined, done:true }
yield • Function will stop and return on yield •
Next call will exec from last yield • Sort of idle
js-csp
js-csp • by Nguyễn Tuấn Anh • Major implementation •
Use async function • Also implement `go`, dispatcher…etc
None
Pingpong Example
function* player(name, table) { while (true) { var ball =
yield csp.take(table); if (ball === csp.CLOSED) { console.log(name + ": table's gone"); return; } ball.hits += 1; console.log(name + " " + ball.hits); yield csp.timeout(100); yield csp.put(table, ball); } }
function* player(name, table) { while (true) { var ball =
yield csp.take(table); if (ball === csp.CLOSED) { console.log(name + ": table's gone"); return; } ball.hits += 1; console.log(name + " " + ball.hits); yield csp.timeout(100); yield csp.put(table, ball); } } func player(name string, table chan *Ball) { for { ball := <-table ball.hits++ fmt.Println(name, ball.hits) time.Sleep(100 * time.Millisecond) table <- ball } } Go
csp.go(function* () { var table = csp.chan(); csp.go(player, ["ping", table]);
csp.go(player, ["pong", table]); yield csp.put(table, {hits: 0}); yield csp.timeout(1000); table.close(); });
csp.go(function* () { var table = csp.chan(); csp.go(player, ["ping", table]);
csp.go(player, ["pong", table]); yield csp.put(table, {hits: 0}); yield csp.timeout(1000); table.close(); }); func main() { table := make(chan *Ball) go player("ping", table) go player("pong", table) table <- new(Ball) time.Sleep(1 * time.Second) <-table } Go
csp.go(player, ["ping", table]); go player("ping", table) yield csp.put(table, {hits: 0});
table <- new(Ball) yield csp.take(table); <-table
csp.go(function* () { func main() { var table = csp.chan();
table := make(chan *Ball) yield csp.timeout(1000); time.Sleep(1 * time.Second)
js-csp • Easy to port Go program • yield is
annoying
What Can Use CSP • Sequential async data • Event
Real World Event • Might have multiple event handler on
single event
Channel Message • Only can take once
operations alt mult mix merge onto pipe split close timeout
https://clojure.github.io/core.async/
mult • one to many
var csp = require("./src/csp"); var mult = csp.operations.mult; var buffers
= csp.buffers; var channel = csp.chan(); var m = mult(channel); https://github.com/ubolonton/js-csp/issues/31#issuecomment-68089526
var csp = require("./src/csp"); var mult = csp.operations.mult; var buffers
= csp.buffers; var channel = csp.chan(); var m = mult(channel);
csp.go(function*() { var out = mult.tap(m, csp.chan(buffers.sliding(1))); var val =
yield csp.take(out); console.log('process 1', val); }); csp.go(function*() { var out = mult.tap(m, csp.chan(buffers.sliding(1))); var val = yield csp.take(out); console.log('process 2', val); });
csp.go(function*() { var out = mult.tap(m, csp.chan(buffers.sliding(1))); var val =
yield csp.take(out); console.log('process 1', val); }); csp.go(function*() { var out = mult.tap(m, csp.chan(buffers.sliding(1))); var val = yield csp.take(out); console.log('process 2', val); });
csp.go(function*() { var out = mult.tap(m, csp.chan(buffers.sliding(1))); var val =
yield csp.take(out); console.log('process 1', val); }); csp.go(function*() { var out = mult.tap(m, csp.chan(buffers.sliding(1))); var val = yield csp.take(out); console.log('process 2', val); });
csp.putAsync(channel, 42);
not stable on js-csp
Cons • Annoying yield • Not stable operations* • Lib
size • Not support Web Worker
js-csp • Syntax from Go • Operations from Clojure •
Have disadvantages • Can use transducer from Clojure
https://www.youtube.com/watch?v=7rDsRXj9-cU