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
Being Flux on Electron
Search
Rize MISUMI
April 24, 2015
Technology
2
1.3k
Being Flux on Electron
Electron (Atom Shell) 勉強会 #1
Rize MISUMI
April 24, 2015
Tweet
Share
More Decks by Rize MISUMI
See All by Rize MISUMI
5 Smashing Changes Your Extension Will Encounter #phpblt
misumirize
0
2.9k
Effective Espresso #roppongi_aar
misumirize
0
2.3k
Build your APK beyond Docker #dockerlt
misumirize
2
2.9k
某イベントを支えるRuby
misumirize
0
970
Other Decks in Technology
See All in Technology
なぜ私はいま、ここにいるのか? #もがく中堅デザイナー #プロダクトデザイナー
bengo4com
0
1.3k
Core Audio tapを使ったリアルタイム音声処理のお話
yuta0306
0
150
LangSmith×Webhook連携で実現するプロンプトドリブンCI/CD
sergicalsix
1
150
さくらのIaaS基盤のモニタリングとOpenTelemetry/OSC Hokkaido 2025
fujiwara3
2
250
Node-REDのFunctionノードでMCPサーバーの実装を試してみた / Node-RED × MCP 勉強会 vol.1
you
PRO
0
130
生成AI開発案件におけるClineの業務活用事例とTips
shinya337
0
180
WordPressから ヘッドレスCMSへ! Storyblokへの移行プロセス
nyata
0
340
Connect 100+を支える技術
kanyamaguc
0
150
rubygem開発で鍛える設計力
joker1007
2
270
Node-RED × MCP 勉強会 vol.1
1ftseabass
PRO
0
180
解析の定理証明実践@Lean 4
dec9ue
1
200
ビズリーチが挑む メトリクスを活用した技術的負債の解消 / dev-productivity-con2025
visional_engineering_and_design
0
130
Featured
See All Featured
Designing Experiences People Love
moore
142
24k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
The World Runs on Bad Software
bkeepers
PRO
69
11k
Unsuck your backbone
ammeep
671
58k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Building Adaptive Systems
keathley
43
2.6k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
A Tale of Four Properties
chriscoyier
160
23k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Adopting Sorbet at Scale
ufuk
77
9.4k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Rails Girls Zürich Keynote
gr2m
94
14k
Transcript
Being Flux on Electron Apr. 24, 2015 / Electron (Atom
Shell) ษڧձ #1 @Misumi_Rize
console.log(me); Twitter @Misumi_Rize GitHub @MisumiRize http://misumirize.hatenablog.com ࠷ۙ React Native Λ
Android Ͱಈ͔ͨ͠Γͯͨ͠
Demo GHCache GitHub Λϒϥζ͠ͳ͕ΒཪଆͰ git clone https://github.com/MisumiRize/GHCache
GHClone Electron WebView, GlobalShortcut, Remote, Shell CoffeeScript ී௨ͷ͍ํ React ී௨ͷ͍ํ
Flux Architecture ޙड़
WebView ϨϯμϥʔͱผϓϩηεͰϖʔδඳը σϑΥϧτͰ Node ػೳͳ͠ ෦తʹ Custom Component
CoffeeScript આ໌ུ require('coffee-script/register')Ͱಈ͘
Flux architecture આ໌ུ
Problem Flux architecture ॲཧ͕Ϩϯμϥʔϓϩηε෦Ͱ݁͢ΔͳΒ ༗ޮ BrowserWindow ؒͰঢ়ଶΛڞ༗͍ͨ͠
Solution: Remote IPC ϝΠϯϓϩηεͱϨϯμϥʔͷؒͰ௨৴ ͦΕΛநԽͨ͠ػೳ͕ Remote େࡶʹݴ͏ͱɺϝΠϯϓϩηεͰಈ͘ API ΛϨϯμϥʔ͔Βݺ Δ
Using Remote ϝΠϯϓϩηεଆʹ Dispatcher, Store ͷηοτΛ࡞ΕΞϓϦέ ʔγϣϯશମʹมߋ௨Ͱ͖Δ
Flux on Electron rev.1
Problem again ϨϯμϥʔϓϩηεͷΦϒδΣΫτ͕ React ͷϥΠϑαΠΫϧΛ֎ ΕΔ e.g. ΟϯυΛด͡ΔͱɺϝΠϯϓϩηεͷ Store ʹͭͳ͗ࠐΜ
ͩ Listener ͕औΓআ͔Εͳ͍··Ϩϯμϥʔ͕ࣺͯΒΕΔ
Dispose of Renderer ϝΠϯϓϩηε͕ϨϯμϥʔଆͷΦϒδΣΫτΛࢀর͍ͯͨ͠ ߹ɺϨϯμϥʔ͕ഁغ͞ΕΔͱແޮͳࢀরͱͳΔ ࢀর͢Δͱ NullPointerException ঢ়ଶ
Deja vu ωΠςΟϒΞϓϦέʔγϣϯతͳਏ͞ IPC ͕ࣦഊ͢Δ͚͔ͩͩΒϚγͱݴ͑Δ
Flux is not enough Flux Architecture ϥΠϑαΠΫϧͷϢʔβૢ࡞͕શͯഁյతͰ ͳ͍߹ͷΈ༗ޮ ϥΠϑαΠΫϧதʹը໘͕ด͡ΒΕͯഁغ͞ΕΔͷఆͷൣғ֎
Dispose of View at Flux ࠷ऴతͳഁغ View
Activity BrowserWindow ͷഁغΛୡ MVP ͬΆ͍͚Ͳҧ͏
Flux on Electron rev.2
Conclusion ࣗ༝͕ߴ͍ωΠσΟϒΞϓ Ϧέʔγϣϯʹ͍ۙਏ͕͋͞Δ Flux શ໘ల։ແཧ͕͋Δ ͍Ζ͍ΖߏΛߟ͑Δͱ໘നͦ ͏
cyclotron by Robert Couse-Baker https://www.flickr.com/photos/29233640@N07/6781174568