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
ReactiveCocoaのゆるい紹介とメルカリでの活用事例
Search
Shinichiro Oba
August 11, 2015
Programming
3
3.5k
ReactiveCocoaのゆるい紹介とメルカリでの活用事例
Retty Tech Cafe第3回「スタートアップ×iOS開発」で発表した資料に加筆+修正をしたものです
https://atnd.org/events/67600
Shinichiro Oba
August 11, 2015
Tweet
Share
More Decks by Shinichiro Oba
See All by Shinichiro Oba
サーバサイドエンジニアと効率よく開発するためにやっていること
bricklife
8
2k
アッテ開発の技術:Swift と RxSwift
bricklife
19
17k
RxSwiftのobserveOnとsubscribeOnを理解する
bricklife
20
7.1k
Swift 2.0でRxSwift、ReactKit、ReactiveCocoaを使ってみた
bricklife
10
4.8k
Apple Pay対応のやりかた
bricklife
1
25k
iOS版グローバル対応の罠と技
bricklife
8
24k
Other Decks in Programming
See All in Programming
リハビリmruby
kishima
1
160
Composing an API the *right* way (Droidcon Berlin 2024)
zsmb
1
450
Jetpack for KMP
fornewid
1
290
APIのない大学ログインWebサービスをWKWebViewとJavaScriptでアプリ化した話
akidon0000
1
330
Webエディタライブラリ 「CodeMirror」から学ぶ Webアプリ開発のテクニック
ryosukeigarashi
0
250
【Go言語】ジェネリクス
tomo1227
0
170
Introduction to GitOps
hwchiu
0
110
社内 LT 会を発足し、アウトプット文化を醸成させるために考えたこと・やったこと / Starting internal LT meetings and fostering an output culture
mackey0225
3
120
Async Await: Mastering Python's Time-Bending Tricks - EuroPython2024
yanbo
1
290
CSC307 Lecture 11
javiergs
PRO
0
240
Temporalを取り巻く仕様を整理する
sajikix
0
110
しくじり先生 Image Matching Challenge 2024 編
goosehaaan
0
810
Featured
See All Featured
It's Worth the Effort
3n
181
27k
Ruby is Unlike a Banana
tanoku
96
10k
Principles of Awesome APIs and How to Build Them.
keavy
124
16k
Web development in the modern age
philhawksworth
203
10k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.9k
Being A Developer After 40
akosma
72
580k
Producing Creativity
orderedlist
PRO
340
39k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
GraphQLとの向き合い方2022年版
quramy
36
13k
The Invisible Customer
myddelton
117
13k
What’s in a name? Adding method to the madness
productmarketing
PRO
21
2.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
149
45k
Transcript
ReactiveCocoaのゆるい紹介と メルカリでの活⽤用事例例 株式会社メルカリ iOSエンジニア ⼤大庭慎⼀一郎郎
⾃自⼰己紹介 ⼤大庭 慎⼀一郎郎 (ooba / bricklife) 株式会社メルカリ 2013年年4⽉月⼊入社
「メルカリ」iOS版を開発
メルカリとは? いわゆる「フリマアプリ」 2013年年7⽉月 JP版リリース 2014年年8⽉月 US版リリース
はじめに 間違っていても怒怒らないで…! ツッコミは⼤大歓迎です! 先⼈人たちによる偉⼤大なドキュメント からの引⽤用多め
ReactiveCocoaの ゆるい紹介
ReactiveCocoaとは "ReactiveCocoa (RAC) is a Cocoa framework inspired by
Functional Reactive Programming. It provides APIs for composing and transforming streams of values over time.” https://github.com/ReactiveCocoa/ReactiveCocoa
Functional Reactive Programming (FRP) とは?
FRPとは 「⾮非同期データストリームを⽤用いた プログラミング」などと説明される ことが多い
よくわかんない\(^o^)/
よくわからないので ReactiveCocoa (RAC) が提供する ものから追っていきたいと思います
RACが提供するもの 1. ストリームを⽣生成する⽅方法 2. ストリームを加⼯工する⽅方法 3. ストリームを監視する⽅方法
+便便利利なマクロ
ようするにRACは ストリームを作ったり使ったり するライブラリ
これがストリームだ! 完了了 エラー データ 時間 どちらかの発⽣生によって ストリームが終わる 開始 or
ストリームの⽣生成 RACはCocoaフレームワーク上の様々な ものをストリームに変えられる 例例:⽂文字列列、配列列、KVO、UIイベント、 ネットワーク通信、デリゲートメソッド 呼び出し、etc.
RACが提供するカテゴリ
配列列のストリーム化 [0, 1, 2, 3]
タップのストリーム化 タップ ダブルタップ タップ
テキスト⼊入⼒力力のストリーム化 " "#$ "# "# A B C Delete
ネットワーク通信のストリーム化 ϦΫΤετ ड৴த ड৴ྃ த Ϩεϙϯε
IUUQTHJTUHJUIVCDPNTUBMU[FFCDBCDG
ストリームの加⼯工 ストリーム上のデータに対して filter した り map したり merge したり zip
したり reduce したりできる オペレータと呼ばれる ここが関数型、すなわちFunctional!
filter IUUQOFJMQBNFSBDNBSCMFTpMUFS
map IUUQOFJMQBNFSBDNBSCMFTNBQ
merge IUUQOFJMQBNFSBDNBSCMFTNFSHF
zip IUUQOFJMQBNFSBDNBSCMFT[JQ
reduce IUUQOFJMQBNFSBDNBSCMFTSFEVDF
例例:ダブルタップのストリーム IUUQTHJTUHJUIVCDPNTUBMU[FFCDBCDG
どんな加⼯工ができるか 「RAC Marbles」やその元の「RxMarbles」を⾒見見る とオペレータの種類とその効果がインタラクティブに わかるのでオススメ http://neilpa.me/rac-‐‑‒marbles/ http://rxmarbles.com/
ストリームの監視 購読 (Subscribe) という ストリームに流流れてくるデータを順次処理理 配列列に戻す、UIへの表⽰示、プロパティの更更新、 画⾯面遷移、etc.
すべてを使ったコードの例例 [[[self.textField rac_textSignal] filter:^BOOL(NSString *value) { return value.length > 0;
}] subscribeNext:^(NSString *value) { NSLog(@“%@", value); }]; -‐‑‒rac_̲textSignal ⼊入⼒力力⽂文字列列からストリームを⽣生成 -‐‑‒filter: ストリームをfilterして空⽂文字列列が 含まれないように加⼯工 -‐‑‒subscribeNext: ストリームを購読してログ出⼒力力
便便利利なマクロ たったこれだけで text プロパティの変更更を ラベルに⾃自動反映できる! RAC(self.label, text) = RACObserve(self, text);
ストリームを使ってできること リスト処理理 ⾮非同期イベント処理理 データバインディング Promise MVVM,
etc.
なにがうれしいか いろんな⾮非同期処理理を 「ストリームをどう扱うか」 という視点から「宣⾔言的」に記述できる
メルカリでの活⽤用事例例
RAC導⼊入の歴史 2014/8に pod ʻ‘ReactiveCocoaʼ’ 最初に使ったのはUIAlertViewのRACサポート 徐々に適⽤用箇所を広げる 現在iOSエンジニア4⼈人全員がRACを使うように
読み込んだ記事 The introduction to Reactive Programming you've been missing
https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 【翻訳】あなたが求めていたリアクティブプログラミ ング⼊入⾨門 http://ninjinkun.hatenablog.com/entry/introrxja
読み込んだ本 「Functional Reactive Programming on iOS」 https://leanpub.com/iosfrp/ 当時の表紙
RACでやっていること リスト処理理 ⾮非同期イベント処理理 データバインディング Promise MVVM,
etc.
RACを使っている画⾯面 住所編集画⾯面 住所⼀一覧画⾯面 銀⾏行行情報編集画⾯面 検索索条件選択画⾯面 通知設定画⾯面
⽀支払い⽅方法選択画⾯面 商品⼀一覧画⾯面 購⼊入画⾯面 検索索コーチマーク画⾯面 検索索サジェスト画⾯面
実際の画⾯面は メルカリをダウンロードして ⾒見見てください!!! IUUQTJUVOFTBQQMFDPNKQBQQJE
データバインディングの例例 銀⾏行行情報編集画⾯面 プロパティの変更更をテキストフィールドに⾃自動反映 検索索サジェスト画⾯面 テキストフィールドの変更更をプロパティに⾃自動反映 RAC(self.accountNumberTextField, text)
= RACObserve(self.viewModel, accountNumber); RAC(self, inputText) = textField.rac_textSignal;
Promiseの例例 購⼊入画⾯面 タイムアウトを設けた失敗してもよい⾮非同期処理理と 購⼊入APIの完了了を両⽅方待つ RACSignal *timeoutSignal = [[RACSignal merge:@[
_btDataSignal, [RACSignal interval:kBTDataTimeout onScheduler:[RACScheduler mainThreadScheduler]], ]] take:1]; [RACSignal combineLatest:@[_buyAPISignal, timeoutSignal]] subscribeNext:^(RACTuple *tuple) { //... } error:^(NSError *error) { //... }];
MVVMを導⼊入した画⾯面 住所編集画⾯面 住所⼀一覧画⾯面 銀⾏行行情報編集画⾯面 検索索条件選択画⾯面 通知設定画⾯面
⽀支払い⽅方法選択画⾯面 商品⼀一覧画⾯面 購⼊入画⾯面 検索索コーチマーク画⾯面 検索索サジェスト画⾯面
MVVMとは Model View ViewModelというMVCの派⽣生パターン https://ja.wikipedia.org/wiki/Model_̲View_̲ViewModel ViewModelはViewを描画するための状態の保持と、 Viewから受け取った⼊入⼒力力を適切切な形に変換してModel に伝達する役⽬目
ViewModelはテストできる!
応⽤用例例:インクリメンタルサーチ 検索索サジェスト画⾯面 以下とほぼ同じ実装をしている http://qiita.com/ikesyo/items/e699eefe1d0985158420 個⼈人的にFRPが本領領発揮するケースの1つだと思う [[[[[textField.rac_textSignal filter:^BOOL(NSString *text)
{ return text.length > 0; }] throttle:0.5] map:^(NSString *text) { return [[APIClient sharedClient] fetchSearchResultWithQuery:text]; }] switchToLatest] subscribeNext:^(id JSON) { NSLog(@"Search result: %@", JSON); }];
RAC導⼊入時の注意
導⼊入コストが⾼高い 概念念の理理解に時間がかかる メルカリでは独学と知⾒見見のシェアでなんとかした まずはデータバインディングかPromiseからはじめ るといいかも ⼤大量量のオペレータを理理解する必要がある
関数型⾔言語をやっていればなんとかなるか…?
循環参照しやすい 便便利利マクロ@strongifyと@weakifyを駆使 「Implicit retain of ʻ‘selfʼ’ within blocks」をYesに
Instrumentsでメモリの利利⽤用状況をチェック AllocateのMark Generationが便便利利
最初は⼤大変だけど 慣れると楽になってきますよ!
ありがとうございました! スライド内のURL以外に参考にしたURL http://havelog.ayumusato.com/develop/javascript/e657-‐‑‒ reactive_̲programming_̲in_̲javascript.html http://qiita.com/amay077/items/5e7cedb069a5a6ae0ae7 http://yohshiy.blog.fc2.com/blog-‐‑‒entry-‐‑‒215.html
http://www.slideshare.net/taketin/mvvm-‐‑‒40956834