iOS Tech Talk【みてね x Mirrativ】 https://mirrativ.connpass.com/event/240385/
Optimistic UpdatesͰ UXΛ্ͤ͞ΔגࣜձࣾϛΫγΟ ΈͯͶࣄۀ෦ϩΫωϜ @_rockname
View Slide
mixi, Inc.ࣗݾհϩΫωϜ / rockname• ϛΫγΟͰʮՈΞϧόϜ ΈͯͶʯͱ͍͏ΞϓϦΛ ։ൃͯ͠Δ• iOSϝΠϯɺAndroid, RailsͳͲॻ͍ͯΔ• εϚϒϥ͕͖
mixi, Inc.Optimistic Updatesͱ• ྫ͑ɺΈͯͶͰΞοϓϩʔυͨ͠ϝσΟΞΛ͓ؾʹೖΓʹՃͰ͖Δػೳ͕͋Γ·͢• ී௨ʹ࣮͢ΔͳΒɺҎԼͷΑ͏ʹͳΔ͔ͱࢥ͍·͢
mixi, Inc.Optimistic Updatesͱ• ϦΫΤετͷ݁Ռ͕ฦΔલʹɺޭ͢ΔͱԾఆͯ͠UIΛઌʹߋ৽͢Δख๏ͷ͜ͱΛOptimistic Updatesͱݺͼ·͢
mixi, Inc.Optimistic UpdatesͷՁ• Optimistic UpdatesͰɺϢʔβʔͷૢ࡞Λதஅͤ͞Δ͜ͱͳ͘γʔϜϨεͳମݧΛఏڙ͠ଓ͚Δ͜ͱ͕Ͱ͖ΔͨΊɺUXΛ্ͤ͞·͢
mixi, Inc.ͪ͜Βͷهࣄ͕ඇৗʹࢀߟʹͳΓ·ͨ͠!!!https://kaminashi-developer.hatenablog.jp/entry/optimistic-update-in-spaUI͕ӕΛͭ͘ʁ UXσβΠϯʹ͓͚Δʮָ؍తͳߋ৽ʯͱSPAͰͷ࡞ΓํΧϛφγ։ൃऀϒϩά
۩ମతͳ࣮ྫ
mixi, Inc.۩ମతͳ࣮ྫ - ͓ؾʹೖΓ• ઌͷྫͰऔΓ্͛ͨɺ͓ؾʹೖΓػೳʹ͓͚ΔOptimistic Updatesͷ۩ମతͳ࣮ํ๏ʹ͍ͭͯݟͯΈ·͠ΐ͏
mixi, Inc.۩ମతͳ࣮ྫ - ͓ؾʹೖΓ• ϝσΟΞΦϒδΣΫτʹ͋Δ୯ҰͷpropertyΛߋ৽͢ΔͷΈͳͷͰɺ࣮͔ͳΓγϯϓϧͳͷʹͳΓ·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ΈͯͶͰΞοϓϩʔυ͞ΕͨϝσΟΞʹίϝϯτΛ͢Δ͜ͱ͕Ͱ͖·͢• ݱঢ়ͰίϝϯτߘதʹIndicatorΛදࣔ͢ΔΑ͏ʹͳ͍ͬͯ·͢▶︎ ͜ͷίϝϯτػೳΛOptimistic UpdatesͰ࣮͢Δ͜ͱΛߟ͑ͯΈ·͠ΐ͏
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ·ͣOptimistic UpdatesΛ࣮͘͘͢͢͠ɺView༻ͷίϝϯτΦϒδΣΫτͰ͋Δ CommentItem Λ༻ҙ͠·͢• init ͰυϝΠϯΦϒδΣΫτΛड͚औͬͯมͰ͖ΔΑ͏ʹ͍ͯ͠·͢• ޙʹ৭ʑͱproperty͕Ճ͞Ε͍ͯ͘༧ఆͰ͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ࣍ʹɺMVPͰ࣮͢Δ͜ͱલఏͰ͕͢ɺPresenterΛ༻ҙ͠·͢• ͜͜ʹOptimistic Updatesͷ࣮ΛՃ͍͖͑ͯ·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• Presenterʹɺίϝϯτૹ৴ϘλϯԡԼ࣌ʹݺΕΔ addComment ϝιουΛ࣮͍͖ͯ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ͨͩ͠ɺ͜ͷ addComment ࿈ଓͯ͠ԿݺΕΔ͜ͱΛߟྀͰ͖͍ͯ·ͤΜ• Ծʹ1ճͷίʔϧͰϨεϙϯε͕·ͩฦΒͳ͍ؒʹ2ճͷίʔϧ͕ޭ͠ɺͦͷޙ1ճͷίʔϧͰαʔόʔ͔ΒΤϥʔ͕ฦ͖ͬͯͨ߹ɺcomments.removeLast() ҙਤ͍ͯ͠ͳ͍ CommentItem Λআͯ͠͠·͏͜ͱʹͳΓ·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ▶︎ ղܾ͢ΔͨΊʹɺCommentItem ΛҰҙʹࣝผͰ͖ΔΑ͏ʹ mutaitionID ΛՃ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• mutationID ΛCommentItem ʹઃఆ͠ɺϨεϙϯεΛड͚औͬͨࡍʹͦΕΛݩʹదʹΛ ߋ৽͠·͢• ͜ΕͰෳճݺΕͯదʹॲཧͰ͖·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ͨͩ͜ͷ··ͩͱɺOptimistic UpdatesͰԾͷσʔλΛද͍ࣔͯ͠Δঢ়ଶͷViewʹରͯ͠ɺϢʔβʔ͕ίϝϯτͷฤूআ͕Ͱ͖ͯ͠·͍·͢▶︎ ରԠͱͯ͠ɺ·ͩαʔόʔ͔ΒϨεϙϯε͕ฦ͖͍ͬͯͯͳ͍߹Viewͷૢ࡞Λ੍ݶͰ͖ΔΑ͏ʹ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ঢ়ଶΛView͔ΒదʹผͰ͖ΔΑ͏ʹɺCommentItem ʹLoadingState ΛՃ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• addComment ϝιουͰదʹ loadingState Λઃఆ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ͋ͱɺViewଆͰ CommentItem.loadingState Λݟͯɺ .loading ͷ߹ʹૢ࡞Λ੍ݶ͢Εྑ͍͜ͱʹͳΓ·͢ (Viewͷίʔυলུ)▶︎ ͞Βʹɺߘʹࣦഊͨ࣌͠ʹίϝϯτΛλοϓ͢ΔͱϦτϥΠͰ͖ΔΑ͏ʹͯ͠Έ·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ·ͣɺLoadingState ʹ .failure ΛՃ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• addComment ϝιουͷcatchจʹͯ֘͢Δ CommentItem Λআ͢ΔΘΓʹloadingState ʹ .failure Λઃఆ͠·͢
mixi, Inc.۩ମతͳ࣮ྫ - ίϝϯτ• ͋ͱPresenterʹϦτϥΠϝιουΛՃ͠ɺCellΛλοϓͨ͠ࡍʹݺΕΔΑ͏ʹ࣮͠·͢
mixi, Inc.ߘલ ߘத ߘࣦഊ
mixi, Inc.Optimistic Updatesͷ࣮ʹ͍ͭͯৼΓฦΓ• ྫ͓͑ؾʹೖΓػೳͷΑ͏ͳɺΦϒδΣΫτͷ୯Ұpropertyͷߋ৽ʹ͍ͭͯൺֱత؆୯ʹ࣮͕ՄೳͰ͢• ͨͩ͠ɺίϝϯτߘͷΑ͏ͳɺ৽نΦϒδΣΫτͷ࡞ʹ͍ͭͯɺͦΕͳΓʹ͕͔͔Γͦ͏Ͱ͢• ·ͨɺࠓճͯ֘͢Viewͱੜଘظؒͷ͍͠PresenterͷதͰঢ়ଶΛཧ͠·͕ͨ͠ɺԾʹ͜ΕΛଞͷViewʹൖ͍ͤͨ͞ͱͳΔͱɺSingletonείʔϓͷΠϯϝϞϦετΞ or databaseͰঢ়ଶΛཧͭͭ͠ɺ֤ViewͰ݁ՌΛsubscribeͰ͖ΔΑ͏ʹ࣮͢Δඞཁ͕͋Γɺ͔ͳΓࠎ͕ંΕͦ͏Ͱ͢
mixi, Inc.Apollo Clientͷհ• GraphQLΫϥΠΞϯτͰ͋Δ Apollo Ͱɺ͜ͷOptimistic UpdatesͷػೳΛఏڙ͍ͯ͠·͢ (iOSΫϥΠΞϯτͰະ࣮)• ͪ͜ΒͰ mutationID ͷΑ͏ͳͷΛ༻ҙ͠ͳͯ͘ɺϦΫΤετͷޭ, ࣦഊʹԠͯ͡ΩϟογϡΛదʹߋ৽ͯ͘͠Ε·͢• ΩϟογϡΛwatch͍ͯ͠ΔViewʹߋ৽͕ൖ͞Ε·͢• ͨͩ͠ɺઌͷྫͷΑ͏ʹloadingStateʹΑͬͯViewͷݟͨΛม͑ΔΑ͏ͳ͜ͱͰ͖ͳͦ͞͏Ͱ͢ (Apollo ReactͰApolloLinkΛ͑Ͱ͖Δ͔ʁ)Apollo KotlinΑΓ
Thank you!!!