![Page 1: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/1.jpg)
Model-View-Update-CommunicateSession Types meet the Elm Architecture
Simon FowlerUniversity of Edinburgh
ABCD Final Meeting19th December 2019
![Page 2: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/2.jpg)
Functional Session Types
EqualityClient : !Int.!Int.?Bool.End
equalityClient : EqualityClient ⊸ BoolequalityClient(s) ≜let s = send (5, s) inlet s = send (5, s) inlet (res, s) = receive s inclose s; res
→ Session types: Types for protocols→ Here, interested in linear functional
languages→ Huge advances over the course of
ABCD!
2
![Page 3: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/3.jpg)
Interactivity?
Majority of implementations: Command line applications
Really, communication actions triggered by UI events, sending user-specified data
Difficult to embed linear resources into a GUI
Some early work on session types + GUIs, but ad-hoc, not formal→ (Client code in Exceptional Asynchronous Session Types was a mess)
3
![Page 4: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/4.jpg)
TwoFactorClient ≜!(Username,Password).&{Authenticated : ClientBody,Challenge : ?ChallengeKey.!Response.&{Authenticated : ClientBody,
AccessDenied : End},AccessDenied : End
}
![Page 5: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/5.jpg)
TwoFactorClient ≜!(Username,Password).&{Authenticated : ClientBody,Challenge : ?ChallengeKey.!Response.&{Authenticated : ClientBody,
AccessDenied : End},AccessDenied : End
}
![Page 6: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/6.jpg)
Approach
Step 1: Formalise a GUI framework→ I chose Model-View-Update, as pioneered by Elm
π Step 2: Extend formalism with session types→ Some intricacies...
Step 3: Implement in Links→ Result: Idiomatic server and client code for session-
typed web applications
5
![Page 7: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/7.jpg)
Contributions
λMVU: A Formal Model of the MVU Architecture→ First formal characterisation of MVU→ Soundness proofs
Extending λMVU with Session Types→ Formal characterisations of subscriptions and commands from Elm→ Linearity and model transitions allow safe integration of session types
Implementation and Examples→ MVU + extensions implemented in Links language→ Example applications including two-factor authentication and chat server
6
![Page 8: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/8.jpg)
Demo: A box and a label
![Page 9: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/9.jpg)
Model-View-Update
https://www.slideshare.net/RogerioChaves1/introduction-to-elm
Model: State of applicationView: Renders model as HTMLUpdate: Updates model based on UI messages
7
![Page 10: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/10.jpg)
Model-View-Update (in Links)typename Model = (contents: String );typename Message = [| UpdateBox: String |];
sig view : (Model) ~> HTML(Message)fun view(model) {vdom<input
type="text" value="{model.contents}"e:onInput="{fun(str) { UpdateBox(str) }}"/>
<div >{ textNode(reverse(model.contents )) }</div >}
sig updt : (Message , Model) ~> Modelfun updt(UpdateBox(newStr), model) {
(contents = newStr)}
mvuPage (( contents=""), view , updt)
8
![Page 11: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/11.jpg)
Model-View-Update (in Links)typename Model = (contents: String );typename Message = [| UpdateBox: String |];
sig view : (Model) ~> HTML(Message)fun view(model) {vdom<input
type="text" value="{model.contents}"e:onInput="{fun(str) { UpdateBox(str) }}"/>
<div >{ textNode(reverse(model.contents )) }</div >}
sig updt : (Message , Model) ~> Modelfun updt(UpdateBox(newStr), model) {
(contents = newStr)}
mvuPage (( contents=""), view , updt)
8
![Page 12: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/12.jpg)
Model-View-Update (in Links)typename Model = (contents: String );typename Message = [| UpdateBox: String |];
sig view : (Model) ~> HTML(Message)fun view(model) {vdom<input
type="text" value="{model.contents}"e:onInput="{fun(str) { UpdateBox(str) }}"/>
<div >{ textNode(reverse(model.contents )) }</div >}
sig updt : (Message , Model) ~> Modelfun updt(UpdateBox(newStr), model) {
(contents = newStr)}
mvuPage (( contents=""), view , updt)
8
![Page 13: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/13.jpg)
Model-View-Update (in Links)typename Model = (contents: String );typename Message = [| UpdateBox: String |];
sig view : (Model) ~> HTML(Message)fun view(model) {vdom<input
type="text" value="{model.contents}"e:onInput="{fun(str) { UpdateBox(str) }}"/>
<div >{ textNode(reverse(model.contents )) }</div >}
sig updt : (Message , Model) ~> Modelfun updt(UpdateBox(newStr), model) {
(contents = newStr)}
mvuPage (( contents=""), view , updt)
8
![Page 14: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/14.jpg)
λMVU: Model-View-Update, Formally
![Page 15: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/15.jpg)
Syntax
Types A,B,C ::= 1 | A → B | A × B | A + B | String | Int| Html(A) | Attr(A)
String literals sIntegers nTerms L,M,N ::= x | λx.M | M N | () | s | n
| (M,N) | let (x, y) = M in N| inl x | inr x | case L {inl x 7→ M; inr y 7→ N}| htmlTag t M N | htmlText M | htmlEmpty| attr ak M | attrEmpty | M ⋆ N
Tag names t Attribute keys ak ::= at | hAttribute names at Event handler names h
9
![Page 16: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/16.jpg)
Syntactic Sugar
uwwwvhtml
<input type = "text" value = {model.contents}onInput = {λstr.UpdateBox(str)}></input>
<div>{htmlText (reverseString (model.contents))}</div>
}���~
=(htmlTag input((attr type "text") ⋆ (attr value model.contents)⋆(attr onInput (λstr.UpdateBox(str)))) htmlEmpty) ⋆
htmlTag div attrEmpty (htmlText reverseString (model.contents))
10
![Page 17: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/17.jpg)
Semantics by example: Box and a label
model ≜ (contents = "")
view ≜ λmodel.html<input type = "text" value = {model.contents}onInput = {λstr.UpdateBox(str)}></input>
<div>{htmlText (reverseString (model.contents))}</div>
update ≜ λUpdateBox(str).(contents = str)
11
![Page 18: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/18.jpg)
Semantics by example: Box and a label
runmodel view update
12
![Page 19: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/19.jpg)
Semantics by example: Box and a label
〈(model, view model) | (view, update) | ϵ〉#htmlEmpty
12
![Page 20: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/20.jpg)
Semantics by example: Box and a label
〈(model,
<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}>
</input><div></div>
) | (view, update) | ϵ〉#htmlEmpty
12
![Page 21: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/21.jpg)
Semantics by example: Box and a label
〈idle model | (view, update) | ϵ〉#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}@ ϵ></input>
<div @ ϵ></div>
12
![Page 22: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/22.jpg)
Semantics by example: Box and a label
〈idle model | (view, update) | ϵ〉#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}@ click(())·keyDown(75) · keyUp(75) · input("k")></input>
<div @ ϵ></div>
12
![Page 23: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/23.jpg)
Semantics by example: Box and a label
〈idle model | (view, update) | ϵ〉#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}@ input("k")>
</input><div @ ϵ></div>
12
![Page 24: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/24.jpg)
Semantics by example: Box and a label
〈idle model | (view, update) | ϵ〉 ‖ ((UpdateBox("k")))#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}
@ ϵ></input><div @ ϵ></div>
12
![Page 25: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/25.jpg)
Semantics by example: Box and a label
〈idle model | (view, update) | UpdateBox("k")〉#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}
@ ϵ></input><div @ ϵ></div>
12
![Page 26: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/26.jpg)
Semantics by example: Box and a label
〈handle(model, (view, update),UpdateBox("k")) | (view, update) | ϵ〉#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}
@ ϵ></input><div @ ϵ></div>
(where handle(m, (v, u),msg) ≜ let m′ = u (msg,m) in (m′, v m′))
12
![Page 27: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/27.jpg)
Semantics by example: Box and a label
〈(
(contents = ”k”),<input type = "text" value = "k"onInput = {λstr.UpdateBox(str)}>
</input><div>k</div>
) | (view, update) | ϵ〉#<input type = "text" value = ""onInput = {λstr.UpdateBox(str)}
@ ϵ></input><div @ ϵ></div>
12
![Page 28: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/28.jpg)
Semantics by example: Box and a label
〈idle (contents = "k") | (view, update) | ϵ〉#<input type = "text" value = "k"onInput = {λstr.UpdateBox(str)}@ ϵ></input>
<div @ ϵ>k</div>
12
![Page 29: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/29.jpg)
Metatheory
Theorem (Preservation)If Γ ` C and C −→ C′, then Γ ` C′.
Theorem (Event Progress)If · ` C, either:→ there exists some C′ such that C −→E C′; or→ C = 〈idle Vm | (Vv,Vu) | ϵ〉 # D where D cannot be written D[htmlTag−→e t V W]
for some non-empty −→e .
13
![Page 30: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/30.jpg)
Extending λMVU
![Page 31: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/31.jpg)
CommandsCommands: Allow side effects to be performed by event loopExample: Asynchronous naïve Fibonacci
Model ≜ Maybe(Int) Message ≜ StartComputation | Result(Int)
view : Model → Html(Message)view = λmodel.html
{case model {Just(result) 7→ htmlText intToString(x);Nothing 7→ htmlText "Waiting …" } }
<button onClick = {λ().StartComputation}>Start!</button>
update : (Message×Model) → (Model, Cmd(Message))update = λ(msg,model).case msg {StartComputation 7→ (Nothing, cmdSpawn Result(naïveFib(1000)))Result(x) 7→ (Just(x), cmdEmpty)
}
14
![Page 32: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/32.jpg)
CommandsCommands: Allow side effects to be performed by event loopExample: Asynchronous naïve Fibonacci
Model ≜ Maybe(Int) Message ≜ StartComputation | Result(Int)
view : Model → Html(Message)view = λmodel.html
{case model {Just(result) 7→ htmlText intToString(x);Nothing 7→ htmlText "Waiting …" } }
<button onClick = {λ().StartComputation}>Start!</button>
update : (Message×Model) → (Model, Cmd(Message))update = λ(msg,model).case msg {StartComputation 7→ (Nothing, cmdSpawn Result(naïveFib(1000)))Result(x) 7→ (Just(x), cmdEmpty)
}
14
![Page 33: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/33.jpg)
CommandsCommands: Allow side effects to be performed by event loopExample: Asynchronous naïve Fibonacci
Model ≜ Maybe(Int) Message ≜ StartComputation | Result(Int)
view : Model → Html(Message)view = λmodel.html{case model {
Just(result) 7→ htmlText intToString(x);Nothing 7→ htmlText "Waiting …" } }
<button onClick = {λ().StartComputation}>Start!</button>
update : (Message×Model) → (Model, Cmd(Message))update = λ(msg,model).case msg {StartComputation 7→ (Nothing, cmdSpawn Result(naïveFib(1000)))Result(x) 7→ (Just(x), cmdEmpty)
}
14
![Page 34: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/34.jpg)
CommandsCommands: Allow side effects to be performed by event loopExample: Asynchronous naïve Fibonacci
Model ≜ Maybe(Int) Message ≜ StartComputation | Result(Int)
view : Model → Html(Message)view = λmodel.html{case model {
Just(result) 7→ htmlText intToString(x);Nothing 7→ htmlText "Waiting …" } }
<button onClick = {λ().StartComputation}>Start!</button>
update : (Message×Model) → (Model, Cmd(Message))update = λ(msg,model).case msg {StartComputation 7→ (Nothing, cmdSpawn Result(naïveFib(1000)))Result(x) 7→ (Just(x), cmdEmpty)
} 14
![Page 35: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/35.jpg)
Linearity
Stock λMVU does not support linearity (as m′ is used non-linearly when calculatingnew model and view):
handle(m, (v, u),msg) ≜ let m′ = u m in (m′, v m′)
→ Idea: linear parts of model only used in update, not view.Extract unrestricted part of the model:
extract : Model → (Model× UnrestrictedModel)view : UnrestrictedModel → Html(Message)
handle(m, (v, u, e),msg) ≜ let m′ = u (msg,m) inlet (m′, unrM) = e m′ in(m′, v unrM)
15
![Page 36: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/36.jpg)
Demo: PingPong application
![Page 37: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/37.jpg)
PingPong in λMVU
PingPong ≜ µt.!Ping.?Pong.tModel ≜ Pinging(PingPong) | WaitingMessage ≜ Click | Ponged(PingPong)
update ≜ λ(msg,model).case msg {Click 7→ handleClick(model)Ponged(c) 7→ handlePonged(model, c)
}
handleClick(model) ≜case model {Pinging(c) 7→let c = send (Ping, c) inlet cmd =cmdSpawn (let (pong, c) = receive c in
Ponged(c)) in(Waiting, cmd)
Waiting 7→ (Waiting, cmdEmpty)}
handlePonged(model, c) ≜case model {Pinging(c′) 7→cancel c′;(Pinging(c), cmdEmpty)
Waiting 7→(Pinging(c), cmdEmpty)
}
16
![Page 38: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/38.jpg)
PingPong in λMVU
PingPong ≜ µt.!Ping.?Pong.tModel ≜ Pinging(PingPong) | WaitingMessage ≜ Click | Ponged(PingPong)
update ≜ λ(msg,model).case msg {Click 7→ handleClick(model)Ponged(c) 7→ handlePonged(model, c)
}
handleClick(model) ≜case model {Pinging(c) 7→let c = send (Ping, c) inlet cmd =cmdSpawn (let (pong, c) = receive c in
Ponged(c)) in(Waiting, cmd)
Waiting 7→ (Waiting, cmdEmpty)}
handlePonged(model, c) ≜case model {Pinging(c′) 7→cancel c′;(Pinging(c), cmdEmpty)
Waiting 7→(Pinging(c), cmdEmpty)
}
16
![Page 39: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/39.jpg)
Illegal states
Issue→ Must handle messages impossible in a given state (e.g., receiving a pong while
waiting to send a ping)→ Problem: models treated as sum types
Proposal→ Multiple model types, transitions between them→ Make illegal states unrepresentable!
17
![Page 40: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/40.jpg)
Model transitions
Waiting stateWModel ≜ WaitingWUModel ≜ 1WMessage ≜ Ponged(c)
wView ≜ λ(). html<button disabled = "true">Send Ping!
</button>
wUpdate ≜ λ(Ponged(c),Waiting).transition Pinging(c) pViewpUpdate pExtract cmdEmpty
wExtract ≜ λx.(Waiting, ())
Pinging statePModel ≜ Pinging(PingPong)PUModel ≜ 1PMessage ≜ ClickpView ≜ λ(). html
<button onClick = {λ().Click}>Send Ping!
</button>
pUpdate ≜ λ(Click,Pinging(c)).let c = send (Ping, c) inlet cmd =cmdSpawn (let (pong, c) = receive c in
Ponged(c)) intransition ()wView wUpdate wExtract cmd
pExtract ≜ λc.(c, ())
18
![Page 41: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/41.jpg)
Model transitions
Waiting stateWModel ≜ WaitingWUModel ≜ 1WMessage ≜ Ponged(c)
wView ≜ λ(). html<button disabled = "true">Send Ping!
</button>
wUpdate ≜ λ(Ponged(c),Waiting).transition Pinging(c) pViewpUpdate pExtract cmdEmpty
wExtract ≜ λx.(Waiting, ())
Pinging statePModel ≜ Pinging(PingPong)PUModel ≜ 1PMessage ≜ ClickpView ≜ λ(). html
<button onClick = {λ().Click}>Send Ping!
</button>
pUpdate ≜ λ(Click,Pinging(c)).let c = send (Ping, c) inlet cmd =cmdSpawn (let (pong, c) = receive c in
Ponged(c)) intransition ()wView wUpdate wExtract cmd
pExtract ≜ λc.(c, ())
18
![Page 42: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/42.jpg)
Wrapping up
![Page 43: SessionTypesmeettheElmArchitecture Simon Fowler · Formal characterisations of subscriptionsand commandsfrom Elm! Linearityand modeltransitionsallow safe integration of session types](https://reader034.vdocuments.site/reader034/viewer/2022051918/600ab2cd3bbaa675006e36d3/html5/thumbnails/43.jpg)
Conclusion
Summary→ First formal characterisation of MVU architecture→ First formal integration of session-typed communication and GUI programming→ Not only Greek: fully implemented in Links, along with examples
Find out more!→ Draft paper: http://bit.ly/mvu-arxiv→ Artifact: http://bit.ly/mvu-artifact
http://www.links-lang.orgopam install links
19