Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
CSP
Search
othree
February 14, 2015
Technology
250
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
CSP
Communicating Sequential Processes
othree
February 14, 2015
More Decks by othree
See All by othree
How GitHub Supports Vim License Detection, The Five Years Journey
othree
1
2.3k
WAT JavaScript Date
othree
3
2.3k
Modern HTML Email Development
othree
3
2.8k
MRT & GIT
othree
1
2.5k
YAJS.vim and Vim Syntax Highlight
othree
1
3.2k
Web Trends to 2015
othree
4
380
Transducer
othree
9
3.2k
HITCON 11 Photographer
othree
4
570
fetch is the new XHR
othree
6
3.7k
Other Decks in Technology
See All in Technology
内製アプリとClaudeスキルのセキュリティチェック、 Backlogの課題で回しています。
ayaka_egaaa
0
160
PostgreSQL オプティマイザ統計の秘密
nori_shinoda
1
440
Cloudflareの向き先
chimame
1
160
Kiro Crew 入門 (手を離しても進む仕事) | 目指せ Kiro マスター 11
inariku
PRO
4
660
evcc & Home Assistant
naltatis
0
480
新卒エンジニア、 介護士になる
ryu1013
1
690
MCPでAIが自分で調べに行く
cdataj
0
130
AI時代に求められる優秀なTechLeadの振る舞い
pospome
11
15k
AIコーディングはじめました
miso
0
160
公共分野での生成AI活用
toru_kubota
1
310
Gifu WordPress Meetup #200 に向けて、私たちには何ができるだろうか?/ 2026-11-07 Gifu WordPress Meetup
torounit
0
240
DBTS2026 盛り上がってますか!?Databricksが実現するAI時代のデータ基盤
akuwano
1
200
Featured
See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
43k
Building AI with AI
inesmontani
PRO
1
1.4k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
610
New Earth Scene 8
popppiees
4
2.8k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
70
68k
Writing Fast Ruby
sferik
630
63k
Amusing Abliteration
ianozsvald
1
380
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
2
2.2k
Docker and Python
trallard
47
4.3k
Facilitating Awesome Meetings
lara
57
7.2k
Accessibility Awareness
sabderemane
1
290
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
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