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
アプリリリースまでのつらみあれこれ
Search
nitaking
February 21, 2019
Technology
0
660
アプリリリースまでのつらみあれこれ
アプリリリースまでのつらみあれこれ
【第2回】ReactNativeにゆかりのあるスタートアップが集う会
https://r-n.connpass.com/event/117895/
nitaking
February 21, 2019
Tweet
Share
More Decks by nitaking
See All by nitaking
人は30分でLT資料を作って発表できるのか
nitaking
0
250
React Native ことはじめ
nitaking
0
250
2021-06-24 最近のビルドツール調べてみた
nitaking
0
140
Fishのススメ
nitaking
0
72
Blitz.jsの紹介
nitaking
1
1k
Expo WEB × Next.js は実用できるのか?
nitaking
3
1k
react-hooks-loggerつくった話
nitaking
0
510
あの震えるインタラクションを実装したい
nitaking
1
1.4k
React非同期ライブラリを知る
nitaking
0
170
Other Decks in Technology
See All in Technology
20251027_マルチエージェントとは
almondo_event
1
420
Databricks AI/BI Genie の「値ディクショナリー」をAmazonの奥地(S3)まで見に行く
kameitomohiro
1
410
Implementing and Evaluating a High-Level Language with WasmGC and the Wasm Component Model: Scala’s Case
tanishiking
0
180
AI時代、“平均値”ではいられない
uhyo
8
2.6k
serverless team topology
_kensh
3
230
様々なファイルシステム
sat
PRO
0
240
IBC 2025 動画技術関連レポート / IBC 2025 Report
cyberagentdevelopers
PRO
2
170
Behind Postgres 18: The People, the Code, & the Invisible Work | Claire Giordano | PGConfEU 2025
clairegiordano
0
130
頭部ふわふわ浄酔器
uyupun
0
110
ブラウザのAPIで Nintendo Switch用の特殊なゲーム用コントローラーを体験型コンテンツに / IoTLT @ストラタシス・ジャパン
you
PRO
0
130
AI-Readyを目指した非構造化データのメダリオンアーキテクチャ
r_miura
1
320
クラウドとリアルの融合により、製造業はどう変わるのか?〜クラスメソッドの製造業への取組と共に〜
hamadakoji
0
430
Featured
See All Featured
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
54k
Building a Modern Day E-commerce SEO Strategy
aleyda
44
7.8k
For a Future-Friendly Web
brad_frost
180
10k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
2.9k
The Cost Of JavaScript in 2023
addyosmani
55
9.1k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
640
The Art of Programming - Codeland 2020
erikaheidi
56
14k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
GraphQLとの向き合い方2022年版
quramy
49
14k
Building an army of robots
kneath
305
46k
Unsuck your backbone
ammeep
671
58k
The Language of Interfaces
destraynor
162
25k
Transcript
ΞϓϦϦϦʔε·Ͱͷ ͭΒΈ͋Ε͜Ε @nitaking_
About Satoshi Nitawaki • ॴଐ • ΤΞʔΫϩʔθοτ • ΞϓϦϝΠϯ /
ϑϩϯτ / αʔό • ܦྺ • SIer / ࣾSE • ΞΧϯτ • Twitter: @nitaking_ • Github: @nitaking
ΤΞʔΫϩʔθοτ • αʔϏε • ϓϩͷελΠϦετ͕͋ͳͨͷͨΊʹίʔσΟωʔτ • ύʔιφϧελΠϦϯά • ঁੑ͚आΓ์ͷϑΝογϣϯϨϯλϧαʔϏε
React Native࠾༻ʹࢸΔ·Ͱ • طଘͷiOSΞϓϦʢSwitfʣΛϦϓϨʔε • iOSΤϯδχΞෆࡏ • ϝϯςφϯε͞Εͳ͍ΞϓϦ • ߋ৽͞Εଓ͚ΔWEBΞϓϦ
• ಡΊͳ͍Swiftͷίʔυ • Androidཉ͍͠
ϦϓϨʔεͷํ • ϝΠϯػೳReact NativeͰ࣮ • ҎԼWebViewͰճආ • ϦϦʔεʹؒʹ߹Θͳ͍༏ઌΊͳػೳ • ܾࡁपΓը໘
• tokenೝূ͕͠ΜͲͦ͏
ओʹਏ͔ͬͨͱ͜ Android WebView
Android • WebViewͷFileUploadͰ͖ͳ͍݅ • FlatList × Image => ϨϯμϦϯά͓͔͍͠
WebViewͷFileUploadͰ͖ͳ͍݅ • ϦϦʔε1िؒલʹൃ֮ • RN v0.55.4Ͱൃੜ • v0.57.0Ͱʢͬͱʣղফ͞ΕͨΒ͍͠ ͜ͷλΠϛϯάͰ RNΞοϓάϨʔυʂʁ
WebViewͷFileUploadͰ͖ͳ͍݅ • ༗ࢤʹॿ͚ΒΕͨʂʂʂ • Android<WebView>Λ͜ΕͱೖΕସ͑ͯ༻͢Δ • ࠓݩؾʹಈ͍͍ͯΔ • RNόʔδϣϯΞοϓ͢Δ·Ͱ͓ੈʹ
FlatList × Image • ͳʹ͕ى͖͔ͨ • ϨϯμϦϯά͕·Β • දࣔΧΫ͍ͭͯΔײ •
දࣔ͞Εͳ͍Component • iOSͰى͖ͳ͔ͬͨ *NBHF
FlatList × Image • ղܾࡦ • props: removeClippedSubviews This may
improve scroll performance for large lists.
FlatList × Image removeClippedSubviews: false removeClippedSubviews: true • iOSϝϞϦϦʔΫ͕͏·͍͕ AndroidϝϞϦϦʔΫ͞Εͯͳ͍ʁ
iOS༏लʁ
WebView • webίϯςϯπΛදࣔ • ࣗಈϩάΠϯ • AuthޙͷtokeΛCookieʹηοτͯ͠ೝূ • ͭ·Γ •
RNͷWebViewʹCookieΛηοτͯ͠ೝূʁ
WebView • ͬͨ͜ͱ • WebViewͷதʹCookieใηοτʁ • <WebView> injectJavaScriptʹsetCookieͷॲཧΛ ߦ͏JSΛ࣮ͯ͠ߦͰ͖ͦ͏ͳײ͕͋͡Δ ࣦഊ
WebView • ߦ͖ண͍ͨ͑ • react-native-cookies(star 600~) • ͔͋ͨϝδϟʔͬΆ͍react-native-cookieඍົ • iOSͱAndroidͰؔ༩͑Δύϥϝʔλผʑ
• iOSCookieೝূOKͰAndroidNGɺ ͱ͍͏͜ͱ͕ൃੜ͍ͯͨ͠
WebView AndroidͱiOSͰ༻్ಉ͡ͳͷʹΠϯλϑΣʔεҧ͏ →݁ߏϋϚͬͨ
͞Βʹ Apple৹ࠪ
Apple৹ࠪ • Ұճɿϕʔλ൛͛ͨ • ௨աͨ͠ • ೋճɿ҆৺ͯ͠͏Ұճ͛ͨ • मਖ਼ͯ͠ͳ͍ͱ͜ΖͷࢦఠͰ৹ࠪམͪͨɻɻɻ
ͳͥʁ
Apple৹ࠪ • ཧ༝ɿ • ձһొSafariͷwebϖʔδʹඈ͍ͯͨ͠ ʢAppϦϯΫ -> Safariϖʔδʣ • ձһొΞϓϦͰ݁ͤͯ͞΄͍͠ͱͷ͜ͱ
• UXͷ؍͔ΒΞϓϦ͕͍͍Αͱͷ͜ͱ ཧ༝Θ͔ͬͨɻ ͰͳΜͰҰճ৹ࠪ௨ͬͨɾɾɾʁ
Apple৹ࠪ • AppWebViewʹΓସ͑ • iOS͢Μ͍͝ΧΫΧΫ͢Δ • Safariͩͱ͘͢͝αΫαΫಈ͍ͯΔ • Android͍͢͝αΫαΫಈ͘ɾɾɾ εΫϩʔϧ͢ΒͰ͖ͳ͍݅
WebViewΧΫΧΫ RN WebView Safari
WebViewΧΫΧΫ • ݪҼʢݸਓతݟղʣ • RNͷWebViewύϑΥʔϚϯε͕ѱ͍ • ձһొwebϖʔδͷύϑΥʔϚϯε͕ѱ͍ • ্هͷʮѱ͍×ѱ͍ʯʹΑͬͯҾ͖ى͜͞Ε͍ͯΔ •
WKWebViewͱUIWebViewͷҧ͍ʁʁ • iOS8ͷSafariͰಉ͡ݱΛ࠶ݱ • iOS8 SafariʹRN WebView
WebViewΧΫΧΫ • ରॲ • ෳͷཁҼ͕͋Γͦ͏ͰݪҼٻΓ্͛ɻ • ΞϓϦ༻ձһొϖʔδΛ༻ҙͯ͠Γӽ͑Δ ͠ ؔ࿈͢ΔݟΛ͓࣋ͪͷํ͕͍Ε ڭ͍͑ͯͩ͘͞ʂʂ
·ͱΊ • AndroidϨϯμϦϯά͕ऑ͍ • AndroidWebView͕ڧ͍ • iOSWebViewͷύϑΥʔϚϯε͕ѱ͍ ʢԿ͔͠Βରॲ๏ଘࡏͦ͠͏ʣ • Apple৹ࠪݸਓ͕ࠩ͋Δɻ
• όʔδϣϯΞοϓ։ൃத͜·Ίʹ͍ͬͯͨ΄͏ ͕݈શ͔
͋Γ͕ͱ͏͍͟͝·ͨ͠