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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Rize MISUMI
April 24, 2015
Technology
1.3k
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Being Flux on Electron
Electron (Atom Shell) 勉強会 #1
Rize MISUMI
April 24, 2015
More Decks by Rize MISUMI
See All by Rize MISUMI
5 Smashing Changes Your Extension Will Encounter #phpblt
misumirize
0
3.1k
Effective Espresso #roppongi_aar
misumirize
0
2.5k
Build your APK beyond Docker #dockerlt
misumirize
2
2.9k
某イベントを支えるRuby
misumirize
0
1k
Other Decks in Technology
See All in Technology
【Google Cloud Next Tokyo'26】Gemini Enterprise と Oracle AI Database で実現する、業務データ活用を実現する AI エージェント実装
shisyu_gaku
0
210
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
19k
20260801_スクフェス大阪
kgnkhkr
1
1.1k
第3回しろおびセキュリティスポンサーセッション
log0417
0
140
え?フロントエンドエンジニアの ワイがインフラも!?
puku0x
0
270
『三匹の子ぶた』から学ぶネットワークセキュリティの昔と今 / Network Security: Then and Now Through the Lens of The Three Little Pigs
nttcom
1
1.7k
モダンフロントエンド 開発研修
recruitengineers
PRO
1
310
NetBoxを利用した作業効率化の試み_NetDevNight4
tnoha
0
460
研究開発部の紹介 / Sansan R&D Profile
sansan33
PRO
4
24k
OSPN.JPバージョンアップ作業進捗のご報告 / 20260801-osc26kyoto
akkiesoft
0
260
ガバメントクラウドでのランサムウェア対策
techniczna
1
760
AIが自社のTableauを操作する世界へ:Tableau MCP超入門
tbtykk
0
110
Featured
See All Featured
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
240
Chasing Engaging Ingredients in Design
codingconduct
0
260
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
480
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
3
1.1k
Test your architecture with Archunit
thirion
1
2.3k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
340
Ruling the World: When Life Gets Gamed
codingconduct
0
290
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
760
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
440
Building Adaptive Systems
keathley
44
3.2k
What does AI have to do with Human Rights?
axbom
PRO
1
2.3k
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.7k
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