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
Fluxで複雑な状態の変化を予測可能にするiOSアプリ開発
Search
Kenichi Yonekawa
April 13, 2016
Programming
9
19k
Fluxで複雑な状態の変化を予測可能にするiOSアプリ開発
Reactive Swift Meetup
http://wantedly.connpass.com/event/29039/
Kenichi Yonekawa
April 13, 2016
Tweet
Share
More Decks by Kenichi Yonekawa
See All by Kenichi Yonekawa
iOSアプリの設計とDependency Injection
yonekawa
22
16k
ネイティブアプリでもFluxしたい
yonekawa
0
2.1k
freeeモバイルチームの変遷と進化
yonekawa
0
7.4k
ReactiveCocoa Pitfalls at freee
yonekawa
2
830
RAC用クラス拡張の作り方
yonekawa
2
2.9k
Dive into Joybox
yonekawa
5
1.7k
Other Decks in Programming
See All in Programming
いつか使える ObjectSpace / Maybe useful ObjectSpace
euglena1215
2
140
Increased Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
380
Using Livebook to build and deploy internal tools @ ElixirConf 2024
hugobarauna
0
250
長期運用プロダクトの開発速度を維持し続けるためのリファクタリング実践例
wataruss
8
2.7k
LangChainでWebサイトの内容取得やGitHubソースコード取得
shukob
0
160
Method Swizzlingを行うライブラリにおけるマルチモジュール設計
yoshikma
0
120
Kotlin 2.0が与えるAndroid開発の進化
masayukisuda
1
410
GraphQL あるいは React における自律的なデータ取得について
quramy
11
3k
LangGraphでのHuman-in-the-Loopの実装
os1ma
3
1.1k
マルチモジュールにおけるテスト最適化
fxwx23
0
210
Rechartsで楽にゴリゴリにカスタマイズする!
10tera
1
170
Scala におけるコンパイラエラーとの付き合い方
chencmd
2
430
Featured
See All Featured
Intergalactic Javascript Robots from Outer Space
tanoku
268
26k
In The Pink: A Labor of Love
frogandcode
139
22k
Building a Modern Day E-commerce SEO Strategy
aleyda
36
6.8k
Adopting Sorbet at Scale
ufuk
73
8.9k
Statistics for Hackers
jakevdp
794
220k
Happy Clients
brianwarren
96
6.6k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
502
140k
Clear Off the Table
cherdarchuk
91
320k
GitHub's CSS Performance
jonrohan
1030
450k
The Brand Is Dead. Long Live the Brand.
mthomps
53
38k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
29
2.6k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Transcript
@yonekawa 'MVYͰෳࡶͳঢ়ଶͷมԽΛ ༧ଌՄೳʹ͢ΔJ04ΞϓϦ։ൃ
None
None
GSFFFͷJ04ΞϓϦ
https://itunes.apple.com/jp/app/id811207074
ಛతͳ՝ • ͋ΔೖྗબʹΑͬͯՃͷϑΥʔϜ͕දࣔ/ඇදࣔʹ ͳͬͨΓ͢Δέʔε͕ଟ͘ɺViewͷঢ়ଶཧ͕ෳࡶ • 1ͭͷσʔλมߋॲཧʹରͯ͠ෳͷϞσϧ͕ؔ࿈͠ɺґଘ ͠߹͏͜ͱ͕ଟ͍ • ΞϓϦͱͯ͠ͷػೳͷଟ͞ɺͦΕΒ͕૬ޓʹؔ࿈͋͠͏ը໘ ભҠͷෳࡶ͞
MVVMͷ࠾༻ • ViewModelͰViewͷঢ়ଶͱϏδωεϩδοΫΛཧ • ReactiveCocoaͷRACSignalΛView͕subscribeͯ͠ঢ়ଶΛ όΠϯσΟϯά͢Δ • ViewModelʹมԽ͕ى͖Δͱ֘ͷϓϩύςΟͷมߋ͕ RACSignalʹΑͬͯ௨͞ΕɺView͕Ԡ͢Δ
ViewController ViewModel APIClient ߏ VIEW VIEW View ϝιουݺͼग़͠ RACSignal VIEW
VIEW Model
ݱঢ়ͷ՝ • ΞϓϦͷن͕େ͖͘ͳΔʹͭΕͯɺUIΠϕϯτγεςϜ ΠϕϯτʹΑΔঢ়ଶͷมԽΛཧͰ͖ͳ͘ͳ͖ͬͯͨ • ViewModelͱͷํόΠϯσΟϯάʹΑΔґଘؔͷ ༧ଌͷͮ͠Β͞ • ঢ়ଶͷཧͱϞσϧͷૢ࡞ͱυϝΠϯϩδοΫ͕ີ݁߹ •
Ͳ͜Ͱ୭ʹΑͬͯԿ͕มΘͬͯࠓͲ͏ͳͬͯΔͷ͔͕͍͔ ͚ͮΒ͍
WebϑϩϯτΤϯυ͔ΒֶͿ • JavaScriptͷੈքͰMVVM (2way-binding) ͏·͘ड͚ ೖΕΒΕͳ͔ͬͨ • ReactͷొʹΑͬͯΞʔΩςΫνϟͷτϨϯυFluxΛݩ ʹͨ͠୯ํϑϩʔ
Flux facebook/flux: Application Architecture for Building User Interfaces
ΑΓྑ͍ΞʔΩςΫνϟͷԾઆ • WebϑϩϯτΤϯυͷྺ࢙͔ΒɺfreeeΞϓϦ๊͕͍͑ͯΔ ํόΠϯσΟϯάͷຊ࣭తͳͳͷͰ • ୯ํϑϩʔͷίϯηϓτiOSʹ͓͍ͯViewͷঢ়ଶཧ Λ៉ྷʹ͢ΔͨΊʹ༗༻ͳͷͰ
'MVYͷ࠾༻
جຊϑϩʔ • Viewͷঢ়ଶΛStore͕࣋ͪɺStoreActionͷൃߦΛͪड ͚Δ • StoreΛ֎෦͔Βมߋ͢Δ͜ͱͰ͖ͣɺdispatch͞Εͨ ActionʹԠͯࣗ͡Ͱมߋ͢ΔͷΈ • StoreͦΕ͕มߋ͞Εͨ͜ͱͷΈΛViewʹ௨͢Δ •
มߋ͞ΕͨࠩΛૹͬͨΓ͠ͳ͍ • ViewৗʹStoreͷ࠷৽ͷঢ়ଶ͔Βߏங͞ΕΔ
։ൃํ • جຊతʹViewControllerͱ1:1ͰStoreΛ࡞Γঢ়ଶΛཧ͢Δ • ΞϓϦέʔγϣϯશମͷঢ়ଶʢೝূ͍ͯ͠Δͱ͔ʣΛཧ͢Δ StoreΛ࡞Γɺάϩʔόϧʹอ࣋͢Δ • APIϦΫΤετActionCreatorͰߦ͍ɺ݁ՌΛActionͷ Payloadͱͯ͠Storeʹड͚͢ •
Realm(DB)ͷอଘΞϓϦέʔγϣϯͷঢ়ଶมԽͱΈͳ͠ StoreͰߦ͏
Store ViewController Store ViewController ߏ Dispatcher Action Action Store Store
(Global) Store ViewController ActionCreator Action Action Application
ϥΠϒϥϦԽ • https://github.com/yonekawa/SwiftFlux • DispatcherͱͦΕʹඥͮ͘Action/StoreͷநԽ • ReduceStoreͱ͔Flux UtilsҰ෦࣮ͯ͠Δ • ϓϩτίϧࢦͰSwiftΒ͠͞Λҙࣝͨ͠
struct FetchTodo: Action { typealias Payload = [Todo] func invoke(dispatcher:
Dispatcher) { Session.sendRequest(FetchTodoRequest()) { result in switch result { case .Success(let todos): dispatcher.dispatch(self, result: Result(value: todos)) case .Failure(let error): dispatcher.dispatch(self, result: Result(error: error)) } } } } Action
class TodoStore: StoreBase { private(set) var todos: [Todo] private(set) var
error: Error? func init() { register(FetchTodo.self) { (result) in switch result { case .Success(let todos): error = nil self.todos = payload emitChange() case .Failure(let error): self.error = error emitChange() } } } } Store
class ViewController: UITableViewController { let store = TodoStore() func viewDidLoad()
{ super.viewDidLoad() store.subscribe { () in tableView.reloadData() } ActionCreator.invoke(FetchAction()) } } ViewController
࣮ઓೖ https://itunes.apple.com/jp/app/id1037197002
ϝϦοτ • ViewৗʹStore͔Βશͯߏங͞ΕΔͷͰɺݱࡏͷViewͷঢ় ଶ͕໌ࣔతʹͳΓݟ௨͕͠Α͘ͳΔ • StoreΛߋ৽͢ΔͷStore͔ࣗ͋͠Γಘͳ͍ͷͰɺঢ়ଶͷ มԽ֘ͷAction͕ൃߦ͞Ε͔ͨΛ͏͚ͩͰΑ͍ • APIϦΫΤετͷঢ়ଶΛม͑ಘΔϩδοΫͱঢ়ଶΛཧ͢ ΔॴΛ໌֬ʹ͚ΒΕΔ
Viewͷࠩߋ৽ • SwiftͷੈքʹReact͕ଘࡏ͠ͳ͍ɻͦΕͬΆ͍ͷ͍͘ ͔ͭ͋Δ͕Viewͷ࡞Γํ͕ಠࣗʹͳ͓ͬͯΓɺUIKit͕ఏڙ ͢Δͷ͔Β֎ΕΔͷϦεΫ͕ߴ͍ • ViewΛຖճ࠶ߏங͢Δͷίετ͕͔͔ΔͷͰࠩߋ৽͕ ඞཁɻ͔͠͠ؾΛ͚ͭͳ͍ͱঢ়ଶΛ࡞ͬͯ͠·͏ɻ • UITableViewͳͲΛ͏·ࠩ͘ߋ৽͢Δ൚༻తͳΈ͕΄
͍͠
ίʔυྔ૿͑Δ • ঢ়ଶΛม͑ΔͨΊʹຖճActionͱStoreʹ࣮͕ඞཁ • ୯७ͳೖྗͷөͳͲຖճDispatcherΛܦ༝ͯ͠Store ૹΔͷͰʹͳΔ • ঢ়ଶΛཧ͢ΔͨΊͷखؒͱͯ͋͠Δఔ͔ͨ͠ͳ͍
Τϥʔॲཧ • ActionΛ࡞Δͱ͖ʹൃੜͨ͠ΤϥʔΛͲ͏ѻ͏͖͔ɻࠓ Τϥʔը໘ͷঢ়ଶͷ̍ͭͱͯ͠Storeʹ͍ͯ͠Δ • SVProgressHUDͷΑ͏ͳग़͙ͯ͢ফ͑ΔUIΛ͏߹ɺ Store͕࣋ͭΤϥʔঢ়ଶΛஞҰϦηοτ͢Δͷ͕໘
Ξχϝʔγϣϯ • ۪ʹΔͱ͍͢͝ճͷϑϩʔ͕ճΔ • Ξχϝʔγϣϯͷ։࢝ͱऴྃΛঢ়ଶͱͯ͠ཧ͢Δ͖ʁ • ReactͰ͜Εঢ়ଶཧͷର֎ͱ͍ͯ͠Δ༷ࢠ
'MVYWT3FEVY
Redux • ΞϓϦέʔγϣϯͷঢ়ଶ1ͭͷStoreΦϒδΣΫτ͕ཧ ͢Δ • StateϦʔυΦϯϦʔͰActionͷൃߦʹΑͬͯͷΈมߋ͞ ΕಘΔ • ঢ়ଶͷભҠͨͩͷؔ(Reducer)ʹΑͬͯߦ͏
ReduxͷϝϦοτ • Store͕1͔ͭ͠ଘࡏ͠ͳ͍ͨΊɺঢ়ଶ͕มΘΔॴ͕ΑΓ ݶఆ͞Εͯݟ௨͘͢͠ͳΔ • ҰՕॴͰશͯͷঢ়ଶ͕มΘΔͨΊɺશͳมߋͷཤྺΛอ ࣋Ͱ͖Δ͜ͱʹΑΓɺUndo/RedoͳͲ༰қ • Reducerؔલͷঢ়ଶʹॲཧΛՃ͑ͯ৽͍͠ঢ়ଶΛฦͩ͢ ͚ͳͷͰςετ͍͢͠
Redux or Flux? • جຊతʹReduxͷSingle State TreeΑΓྑ͍ঢ়ଶཧͷ ΈΛఏڙͯ͘͠ΕΔͷͰΑ͍ • ReduxSingle
State TreeΛલఏʹσβΠϯ͞Ε͍ͯΔͷ ͰɺΞϓϦέʔγϣϯશମΛͦΕલఏʹ࡞Βͳ͍ͱ͍͚ͳ͍ • Flux੍͕؇͍ͷͰɺෳࡶͳUIΛ෦తʹஔ͖͑ΔͳͲ طଘͷΞϓϦʹೖΕ͍͢
ReSwift • https://github.com/ReSwift/ReSwift • ReduxͷSwift࣮ • ৄ͘͠ninjinkun͞Μ͕ͯ͘͠ΕΔͱࢥ͍·͢ɻ
·ͱΊ
·ͱΊ • ୯ํϑϩʔͷΞʔΩςΫνϟViewͷঢ়ଶΛݟ௨͢͠ ͯ͘͘͠ΕΔͷͰiOSʹ͓͍ͯϝϦοτ͕͋Δ • React͕ແ͍ͨΊStoreͷঢ়ଶ͔ΒޮΑ͘ViewΛ࡞Δͱ͜ Ζʹ՝͕͋Δ͕ɺͷ༨͋Γͦ͏ • ϥΠϒϥϦࠓͷͱ͜ΖReSwift͕ຊ໋͕ͩɺطଘΞϓϦʹ ద༻͢ΔͳΒγϯϓϧͳFlux͋Γ
SwiftFluxͷࠓޙͷల • ͬͱܕ҆શʹͰ͖ΔΑ͏ʹΠϯλϑΣʔεΛݟ͍ͨ͠ • ෳͷStoreΛଋͶͯཧͰ͖ΔStoreGroupతػೳ • ൚༻తͳࠩߋ৽ͷͨΊͷUIϢʔςΟϦςΟ