Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Being Flux on Electron

Being Flux on Electron

Electron (Atom Shell) 勉強会 #1

2d8205dc9c77318497ef33ba475817fe?s=128

Rize MISUMI

April 24, 2015
Tweet

More Decks by Rize MISUMI

Other Decks in Technology

Transcript

  1. Being Flux on Electron Apr. 24, 2015 / Electron (Atom

    Shell) ษڧձ #1 @Misumi_Rize
  2. console.log(me); Twitter @Misumi_Rize GitHub @MisumiRize http://misumirize.hatenablog.com ࠷ۙ͸ React Native Λ

    Android Ͱಈ͔ͨ͠Γͯͨ͠
  3. Demo GHCache GitHub Λϒϥ΢ζ͠ͳ͕ΒཪଆͰ git clone https://github.com/MisumiRize/GHCache

  4. GHClone Electron WebView, GlobalShortcut, Remote, Shell CoffeeScript ී௨ͷ࢖͍ํ React ී௨ͷ࢖͍ํ

    Flux Architecture ޙड़
  5. WebView ϨϯμϥʔͱผϓϩηεͰϖʔδඳը σϑΥϧτͰ͸ Node ػೳͳ͠ ಺෦తʹ͸ Custom Component

  6. CoffeeScript આ໌ུ require('coffee-script/register')Ͱಈ͘

  7. Flux architecture આ໌ུ

  8. Problem Flux architecture ͸ॲཧ͕Ϩϯμϥʔϓϩηε಺෦Ͱ׬݁͢ΔͳΒ ༗ޮ BrowserWindow ؒͰঢ়ଶΛڞ༗͍ͨ͠

  9. Solution: Remote IPC ϝΠϯϓϩηεͱϨϯμϥʔͷؒͰ௨৴ ͦΕΛந৅Խͨ͠ػೳ͕ Remote େࡶ೺ʹݴ͏ͱɺϝΠϯϓϩηεͰಈ͘ API ΛϨϯμϥʔ͔Βݺ ΂Δ

  10. Using Remote ϝΠϯϓϩηεଆʹ Dispatcher, Store ͷηοτΛ࡞Ε͹ΞϓϦέ ʔγϣϯશମʹมߋ௨஌Ͱ͖Δ

  11. Flux on Electron rev.1

  12. Problem again ϨϯμϥʔϓϩηεͷΦϒδΣΫτ͕ React ͷϥΠϑαΠΫϧΛ֎ ΕΔ e.g. ΢Οϯυ΢Λด͡ΔͱɺϝΠϯϓϩηεͷ Store ʹͭͳ͗ࠐΜ

    ͩ Listener ͕औΓআ͔Εͳ͍··Ϩϯμϥʔ͕ࣺͯΒΕΔ
  13. Dispose of Renderer ϝΠϯϓϩηε͕ϨϯμϥʔଆͷΦϒδΣΫτΛࢀর͍ͯͨ͠৔ ߹ɺϨϯμϥʔ͕ഁغ͞ΕΔͱແޮͳࢀরͱͳΔ ࢀর͢Δͱ NullPointerException ঢ়ଶ

  14. Deja vu ωΠςΟϒΞϓϦέʔγϣϯతͳਏ͞ IPC ͕ࣦഊ͢Δ͚͔ͩͩΒϚγͱ͸ݴ͑Δ

  15. Flux is not enough Flux Architecture ͸ϥΠϑαΠΫϧ಺ͷϢʔβૢ࡞͕શͯഁյతͰ ͳ͍৔߹ͷΈ༗ޮ ϥΠϑαΠΫϧதʹը໘͕ด͡ΒΕͯഁغ͞ΕΔͷ͸૝ఆͷൣғ֎

  16. Dispose of View at Flux ࠷ऴతͳഁغ͸ View

  17. Activity BrowserWindow ͷഁغΛ఻ୡ MVP ͬΆ͍͚Ͳҧ͏

  18. Flux on Electron rev.2

  19. Conclusion ࣗ༝౓͕ߴ͍෼ωΠσΟϒΞϓ Ϧέʔγϣϯʹ͍ۙਏ͕͋͞Δ Flux શ໘ల։͸ແཧ͕͋Δ ͍Ζ͍Ζߏ੒Λߟ͑Δͱ໘നͦ ͏

  20. cyclotron by Robert Couse-Baker https://www.flickr.com/photos/29233640@N07/6781174568