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
Compositional Layoutは銀の弾丸になるのか~実際に導入してみて得た知見、全て...
Search
Satoshi Komatsu
October 07, 2021
Programming
0
2.3k
Compositional Layoutは銀の弾丸になるのか~実際に導入してみて得た知見、全て公開しちゃいます~
After iOSDC 2021のLTで公開した内容になります。
Satoshi Komatsu
October 07, 2021
Tweet
Share
More Decks by Satoshi Komatsu
See All by Satoshi Komatsu
WWDC Labsは怖くない。 Labsの準備とコツ、完全公開します / iOSDC-WWDC-Labs
tosh7
1
1.5k
10年以上の歴史を持つプロダクトのRosettaフリー / zozotown-rosetta-free
tosh7
0
3.1k
Apple silicon導入のウラガワ/ Introducing Apple silicon and its behind the scenes
tosh7
0
1.8k
若手のうちから活躍したいんじゃ/ How to work well as a freshman
tosh7
0
100
三年間で100人以上の中高大学生にiOSアプリ開発を教えていて感じたこと
tosh7
1
4.2k
Other Decks in Programming
See All in Programming
推論された型の移植性エラーTS2742に挑む
teamlab
PRO
0
180
Cloudflare Realtime と Workers でつくるサーバーレス WebRTC
nekoya3
0
360
Cursor Meetup Tokyo ゲノミクスとCursor: 進化と制約のあいだ
koido
2
880
イベントストーミングから始めるドメイン駆動設計
jgeem
3
750
Blueskyのプラグインを作ってみた
hakkadaikon
1
410
Rails産でないDBを Railsに引っ越すHACK - Omotesando.rb #110
lnit
1
150
複数アプリケーションを育てていくための共通化戦略
irof
9
3.5k
プロダクト開発でも使おう 関数のオーバーロード
yoiwamoto
0
130
2度もゼロから書き直して、やっとブラウザでぬるぬる動くAIに辿り着いた話
tomoino
0
130
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
100
PT AI без купюр
v0lka
0
210
Using AI Tools Around Software Development
inouehi
0
880
Featured
See All Featured
It's Worth the Effort
3n
184
28k
Documentation Writing (for coders)
carmenintech
71
4.8k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.6k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Music & Morning Musume
bryan
47
6.6k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.7k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.3k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Transcript
Compositional Layout ۜͷؙͱͳΔͷ͔ʂʁ ~࣮ࡍʹಋೖͯ͠Έͯಘͨݟɺશͯެ։ͪ͠Ό͍·͢~ גࣜձࣾZOZ O ZOZOTOWN։ൃຊ෦ ZOZOTOWNΞϓϦ෦ iOSϒϩοΫ খদ
ޛ Copyright © ZOZO, Inc.
© ZOZO, Inc. ͱ͠(@tosh_3) 2020ZOZOςΫϊϩδʔζ(ݱZOZO)ʹ৽ଔೖࣾɻ ࠷ۙͷڵຯCSͱSwiftUIɻ 2 גࣜձࣾZOZ O ZOZOTOWN։ൃຊ෦
ZOZOTOWNΞϓϦ෦ iOSϒϩοΫ
© ZOZO, Inc. https://zozo.jp/ 3 • ϑΝογϣϯ௨ൢαΠτ • 1,400Ҏ্ͷγϣοϓɺ8,400Ҏ্ͷϒϥϯυͷऔΓѻ͍ •
ৗ࣌83ສҎ্ͷΞΠςϜͱຖฏۉ2,900Ҏ্ͷ৽ண Λܝࡌʢ2021 6݄࣌ʣ • ϒϥϯυݹணͷϑΝογϣϯκʔϯʮZOZOUSEDʯ ίεϝઐϞʔϧʮZOZOCOSMEʯɺۺͷઐϞʔϧ ʮZOZOSHOESʯɺϥάδϡΞϦʔˍσβΠφʔζκʔϯ ʮZOZOVILLAʯΛల։ • ଈૹαʔϏε • ΪϑτϥοϐϯάαʔϏε • πέ͍ ͳͲ
© ZOZO, Inc. 4 $PNQPTJUJPOBM-BZPVUʹ͍ͭͯ © ZOZO, Inc.
© ZOZO, Inc. 5 $PNQPTJUJPOBM-BZPVUʹ͍ͭͯ
© ZOZO, Inc. 6 $PNQPTJUJPOBM-BZPVUʹ͍ͭͯ "QQ4UPSF ෳࡶͳϨΠΞτΛҰͭͷ$PMMFDUJPO7JFXͰ ཧ͢Δ͜ͱʹޭ ࢀরɿhttps://developer.apple.com/videos/play/wwdc2019/215/?time=147
© ZOZO, Inc. 7 $PNQPTJUJPOBM-BZPVUʹ͍ͭͯ J04%$+BQBOͰ $PNQPTJUJPOBM-BZPVUʹ͍ͭͯ৮Ε͍ͯͨηογϣϯ
© ZOZO, Inc. 8 ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ © ZOZO, Inc.
© ZOZO, Inc. 9 େنϦχϡʔΞϧʹ͏ɺେ෯ͳσβΠϯมߋ ˠطଘͷઃܭʹରͯ͠ϝεΛೖΕΔ͜ͱ͕Ͱ͖ͨ ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ
© ZOZO, Inc. 10 ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ ;0;0508/ ԣʹεΫϩʔϧͰ͖ΔηΫγϣϯΛ͡Ίͱ͠ɺ͞·͟· ͳλΠϓͷηΫγϣϯ͕ଘࡏ͢Δɻ ηΫγϣϯͷͱͦͷதϓϩϞʔγϣϯʹΑͬͯஞҰ
มԽ͢Δɻ
© ZOZO, Inc. 11 Ͱͳͥ$PNQPTJUJPOBM-BZPVUʁ ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ $PNQPTJUJPOBM-BZPVU $PMMFDUJPO7JFXJO$PMMFDUJPO7JFX
© ZOZO, Inc. 12 ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ $PMMFDUJPO7JFXJO$PMMFDUJPO7JFX $PNQPTJUJPOBM-BZPVU •શମΛҰͭͷCollectionViewͱͯ͠ѻ͏͜ͱ ͕Ͱ͖Δ
•એݴతʹॻ͘͜ͱ͕Ͱ͖Δ •CollectionViewͷதʹԣ͖ͷεΫϩʔϧ͕ ͋ΔViewΛ༰қʹઃఆ͢Δ͜ͱ͕Ͱ͖Δ •CellͷPagingࠨΑͤͳͲΛ؆୯ʹߦ͏͜ ͱ͕Ͱ͖Δ •ෳࡶͳϨΠΞτͰ؆୯ʹॻ͘͜ͱ͕ Ͱ͖Δ •ZOZOTOWNͷதͰ࣮࣮͕͋Δ •ॊೈͳϨΠΞτʹରԠ͢Δ͜ͱ͕Ͱ͖Δ •iOS12ҎલͷOSͰ༻͢Δ͜ͱ͕Ͱ͖Δ •ΑΓॊೈͳCellͷ੍ޚΛߦ͏͜ͱ͕Ͱ͖Δ
© ZOZO, Inc. 13 ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ • ৽σβΠϯApp Storeͷ༷ʹԣεΫϩʔϧ Λଟ༻
• ྆ύλʔϯΛൺֱͨ݁͠Ռɺ ίʔυྔݮগ ηΫγϣϯͷՃͳͲͷॊೈੑ্͕ͬͨ •શମΛҰͭͷCollectionViewͱͯ͠ѻ͏͜ͱ ͕Ͱ͖Δ •એݴతʹॻ͘͜ͱ͕Ͱ͖Δ •CollectionViewͷதʹԣ͖ͷεΫϩʔϧ͕ ͋ΔViewΛ༰қʹઃఆ͢Δ͜ͱ͕Ͱ͖Δ •CellͷPagingࠨΑͤͳͲΛ؆୯ʹߦ͏͜ ͱ͕Ͱ͖Δ •ෳࡶͳϨΠΞτͰ؆୯ʹॻ͘͜ͱ͕ Ͱ͖Δ $PNQPTJUJPOBM-BZPVU
© ZOZO, Inc. 14 ;0;0508/ͷ$PNQPTJUJPOBM-BZPVUରԠ *#1$PMMFDUJPO7JFX $PNQPTJUJPOBM-BZPVU ؛͞ΜʹΑΔαϙʔτ
© ZOZO, Inc. 15 $PNQPTJUJPOBM-BZPVUΛ༻ͨ͠ઃܭ © ZOZO, Inc.
© ZOZO, Inc. 16 $PNQPTJUJPOBM-BZPVUΛ༻ͨ͠ઃܭ $PNQPTJUJPOBM-BZPVU $PNQPTJUJPOBM-BZPVU ✖︎
%JGGBCMF%BUB4PVSDF
© ZOZO, Inc. 17 $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT © ZOZO, Inc.
© ZOZO, Inc. 18 $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT $PNQPTJUJPOBM-BZPVUͷΈ ԣεΫϩʔϧͲͷΑ͏ʹ࣮ͯ͠͞Ε͍ͯΔͷͰ ͠ΐ͏͔ʁ
© ZOZO, Inc. 19 0SUIPHPOBM4DSPMM7JFX w ॎʹεΫϩʔϧͰ͖Δ$PMMFDUJPO7JFXʹରͯ͠ ԣʹεΫϩʔϧͰ͖Δ4DSPMM7JFX
w ͜ͷPSUIPHPOBM4DSPMM7JFXQSJWBUFͳΫϥεͳ ͷͰɺΞΫηεͰ͖ͳ͍ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 20 Ұ෦σβΠϯͰ࣮͕͍͠ w 1BHF$POUSPMͰԿຕ͔Λදࣔ͢Δ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 21 Ұ෦σβΠϯͰ࣮͕͍͠ w 1BHF$POUSPMͰԿຕ͔Λදࣔ͢Δ TDSPMM7JFX%JE4DSPMM͕ݺΕͳ͍ͨΊɺ ݱࡏͷ4DSPMM7JFXͷҐஔΛऔಘ͢Δ͜ͱ͕͍͠ɻ
ˠ/4$PMMFDUJPO-BZPVU4FDUJPO ͷWJTJCMF*UFNT*OWBMJEBUJPO)BOEMFSͰରԠʁ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 22 ˠ/4$PMMFDUJPO-BZPVU4FDUJPO ͷWJTJCMF*UFNT*OWBMJEBUJPO)BOEMFSͰରԠʁ w WJTJCMF*UFNT*OWBMJEBUJPO)BOEMFSͱɺ TDSPMM7JFX%JE4DSPMMʹࣅ͍ͯΔ͕ɺ͜ΕΛ༻͢Δ͜ͱͰɺ
ઃܭʹෳࡶੑ͕૿ͯ͠͠·͏ɻ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 23 ͲͷΑ͏ʹ࣮ͨ͠ͷ͔ʁ w $PNQPTJUJPOBM-BZPVUΛ༻͠ͳ͕Β 'MPX-BZPVUͷύλʔϯͱͷϋΠϒϦοτ ͜͜ͷ4FDUJPOͷ$FMMͷதʹ$PMMFDUJPO7JFXΛஔ
PSUIPHPOBM4DSPMM7JFX༻͍ͯ͠ͳ͍ 'MPX-BZPVUͰQBHJOH࣮ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 24 ͦͷଞ͍͠σβΠϯྫ w ແݶεΫϩʔϧ w 1BHF-PBEJOH
Ζ͏ͱࢥ͑Ͱ͖ͳ͘ͳ͍͔͠Εͳ͍͕ɺ ͳ͔ͳ͔ߴίετʹͳͬͯ͠·͏ɻɻɻ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 25 0SUIPHPOBM4DSPMMJOH#FIBWJPSͷόά 4FDUJPOͷPSUIPHPOBM4DSPMMJOH#FIBWJPSΛ DPOUJOVPVT(SPVQ-FBEJOH#PVOEBSZʹηοτͨ͠߹࠷ޙͷDFMM ͷεΫϩʔϧ͕͏·͘ಈ࡞͠ͳ͍ɻ
J04d·Ͱͷؒʹଘࡏɻ 04ϨϕϧͰͷڍಈͷόάɻ ͋·Γྑ͍ϫʔΫΞϥϯυͳ͠ɻ $PNQPTJUJPOBM-BZPVUʹؔ͢Δ5JQT
© ZOZO, Inc. 26 ·ͱΊ © ZOZO, Inc.
© ZOZO, Inc. 27 ·ͱΊ $PNQPTJUJPOBM-BZPVUۜͷؙͳͷ͔ʁ
© ZOZO, Inc. 28 ·ͱΊ $PNQPTJUJPOBM-BZPVUۜͷؙͳͷ͔ʁ w ύλʔϯҎ্ͷσβΠϯʹରͯ͠ɺରԠෆՄೳͳͷͳ͔ͬͨɻ w
ࠓ·ͰखಈͰௐ͍ͯͨ͠ͷΛௐͯ͘͠ΕΔ"1*͕ἧ͍ͬͯΔͨΊ࣮қ͕Լ͕ͬͨɻ
© ZOZO, Inc. 29 ·ͱΊ $PNQPTJUJPOBM-BZPVUۜͷؙͳͷ͔ʁ w ύλʔϯҎ্ͷσβΠϯʹରͯ͠ɺରԠෆՄೳͳͷͳ͔ͬͨɻ w
ࠓ·ͰखಈͰௐ͍ͯͨ͠ͷΛௐͯ͘͠ΕΔ"1*͕ἧ͍ͬͯΔͨΊ࣮қ͕Լ͕ͬͨɻ ˠύʔπͷΈ߹Θͤʹ͢Δ͜ͱͰϨΠΞτͷ࣮͕༰қʹͰ͖ΔͷͰɺผͷͱ͜Ζʹ࣌ؒ Λׂ͚ΔΑ͏ʹͳͬͨɻ $PMMFDUJPO7JFX͕ඞཁͳ7JFXʹ͓͍ͯɺۜͷؙͱݴ͑Δɻ
© ZOZO, Inc. 30 ·ͱΊ $PNQPTJUJPOBM-BZPVUۜͷؙͳͷ͔ʁ ҰํͰɺ ༻͍ͨ͠"1*͕༻ҙ͞Ε͍ͯͳ͍ͳͲɺϨΠΞτʹΑ͖ͬͯෆ͖͔֬ʹ͋Δɻ ͔͠͠ɺઌ΄Ͳ͋͛ͨϋΠϒϦοτܕͱͯ͑͠ɺͦ͏ݴͬͨղফ͞ΕΔɻ
© ZOZO, Inc. 31 ·ͱΊ $PNQPTJUJPOBM-BZPVUۜͷؙͳͷ͔ʁ Basic features Basic
features Exciting, custom features! Exciting, custom features!
© ZOZO, Inc. 32 ·ͱΊ ZOZOTOWNΞϓϦHomeը໘࠶ઃܭͷي~10Ҏ্ྺ࢙Λ࣋ͭΞϓϦͲͷΑ͏ʹͯ͠ੜ·ΕมΘͬͨͷ͔~ https://techblog.zozo.com/entry/zozotown-ios-home-rearchitecture
© ZOZO, Inc. 33 ੵۃ࠾༻த https://corp.zozo.com/recruit/mid-career/ J04ΤϯδχΞ w ;0;0508/ w
8&"3 w ܭଌϓϥοτϑΥʔϜ ;0;0(-"44 ;0;0."5 w '""/4 w Φʔϓϯϙδγϣϯ
None