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
RPD: Reactive Patch Development
Search
Ulric Wilfred
November 28, 2016
Programming
0
310
RPD: Reactive Patch Development
Presented at JSKongress 2016
Ulric Wilfred
November 28, 2016
Tweet
Share
More Decks by Ulric Wilfred
See All by Ulric Wilfred
Generative Animation with Elm
shamansir
0
220
The Future of Web UI Development
shamansir
0
130
iElm-Tech-JB.pdf
shamansir
0
110
"iElm"
shamansir
0
81
Elm Revolution
shamansir
0
100
Про Гит
shamansir
2
120
Elm: 2D and 3D Graphics
shamansir
1
540
RPD — Reactive Patch Development, Extended Cut
shamansir
0
210
Animatron Player API in Details v3
shamansir
0
450
Other Decks in Programming
See All in Programming
@Environment(\.keyPath)那么好我不允许你们不知道! / atEnvironment keyPath is so good and you should know it!
lovee
0
110
今だからこそ入門する Server-Sent Events (SSE)
nearme_tech
PRO
1
120
アセットのコンパイルについて
ojun9
0
120
ユーザーも開発者も悩ませない TV アプリ開発 ~Compose の内部実装から学ぶフォーカス制御~
taked137
0
150
「手軽で便利」に潜む罠。 Popover API を WCAG 2.2の視点で安全に使うには
taitotnk
0
840
Oracle Database Technology Night 92 Database Connection control FAN-AC
oracle4engineer
PRO
1
440
GitHubとGitLabとAWS CodePipelineでCI/CDを組み比べてみた
satoshi256kbyte
4
220
テストコードはもう書かない:JetBrains AI Assistantに委ねる非同期処理のテスト自動設計・生成
makun
0
250
MCPでVibe Working。そして、結局はContext Eng(略)/ Working with Vibe on MCP And Context Eng
rkaga
5
2.2k
複雑なドメインに挑む.pdf
yukisakai1225
5
1.1k
Compose Multiplatform × AI で作る、次世代アプリ開発支援ツールの設計と実装
thagikura
0
140
Ruby Parser progress report 2025
yui_knk
1
430
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
The Power of CSS Pseudo Elements
geoffreycrofte
77
6k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
We Have a Design System, Now What?
morganepeng
53
7.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.7k
Speed Design
sergeychernyshev
32
1.1k
Designing for Performance
lara
610
69k
Code Reviewing Like a Champion
maltzj
525
40k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Transcript
Anton ‘shamansir’ Kotenko JetBrains GmbH (Ulric Wilfred)
RPD Framework Flow Programming for Everyone for Everyone http://shamansir.github.io/rpd
None
None
Examples: http://shamansir.github.io/rpd/examples
Styles:
* SVG and HTML rendering * Very Simple API *
Lightweight * Built using Functional Programming principles * Easy to create Toolkits * Easy to implement Rendering and define Styles * Easy to connect to other libs (Sound, Animation etc.) * Supports any async stuff w/Reactive Streams
var patch = Rpd.addPatch(‘Title’);
var node = patch.addNode(‘jb/voronoi’);
var inlet = node.inlets[‘source’];
var inlet = node.addInlet(‘core/any’, ‘source’);
inlet.receive(loadImage(‘myImage.jpg’));
outlet.connect(someInlet);
outlet.send(Kefir.later(1000, ‘foo’));
Rpd.nodetype(‘my/sum’, { inlets: { a: { type: ‘core/number’ }, b:
{ type: ‘core/number’ } }, outlet: { sum: { type: ‘core/number’ } }, process: function(inlets) { return { sum: inlets.a + inlets.b } } });
Rpd.nodetype(‘my/sum’, { inlets: { a: { type: ‘core/number’ }, b:
{ type: ‘core/number’ } }, outlet: { sum: { type: ‘core/number’ } }, process: function(inlets) { return { sum: Kefir.later( 1000, inlets.a + inlets.b ); } } });
Rpd.noderender(‘my/sum’, ‘svg’, { first: function(bodyElm) { … }, always: function(bodyElm,
inlets, outlets) { bodyElm.innerText = inlets.a + inlets.b + outlets.sum; } });
Rpd.nodetype(‘my/sum’, function() { return { inlets: { … }, outlet:
{ … }, process: function(…) { … } } });
Rpd.noderenderer(‘my/sum’, ‘svg’, function() { return { first: function(…) { …
}, always: function(…) { … } }; });
RPD Framework Flow Programming for Everyone for Everyone http://shamansir.github.io/rpd