iOSDC_LT.pdf

Transcript

1. 1.

   ˏcosmeΞϓϦʹ͓͚Δ Textureͷ׆༻ 2018/09/01 iOSDC 2018 LT@aboy

2. 2.

   ࣗݾ঺հ • Ѩอ༑໵ • aboy/@suxisuxido • גࣜձࣾΞΠελΠϧ • iOSΤϯδχΞ/GoͰAPIΛॻ͖࢝ΊͨϚϯ

3. 3.

   ࿩͢͜ͱ • ˏcosmeͱ͍͏εϚϗΞϓϦͷύϑΥʔϚϯ εվળͷҰ؀ͱͯ͠ɺTextureΛҰ෦ͷը໘Ͱ ݕূͯ͠ΈͨͷͰͭΒͭΒͱ࿩͢

4. 4.

   ˏcosmeΞϓϦͷͭ͘Γ • MVVM/Clean Architecture + RxSwift • جຊ 1view <=>

   1view model • xib/storyboardʹΑΔview؅ཧ • جຊ 1view <=> 1xib/storyboard • AutoLayout/UIStackViewΰϦΰϦ࢖ͬͯΔ
5. 5.

   ͱ͋Δը໘ • iPod TouchͰಈ͔͢ • ͍͍ͩͨ30~45fps ಈը

6. 6.

   αΫαΫಈ͘Α͏ʹ͍ͨ͠

7. 7.

   None
8. 8.

   Textureͱ͸ • Pinterest͕࡞ͬͯΔඇಉظUIϑϨʔϜϫʔΫ • ϨΠΞ΢τܭࢉ͸όοΫάϥ΢ϯυεϨουͰඇಉظతʹߦ ΘΕΔ • ϨΠΞ΢τ͸શͯίʔυͰߦ͏ • CSS

   FlexboxϥΠΫͳಠࣗͷϨΠΞ΢τAPI • UIKitͰ͍͏View͸TextureͰ͸NodeͱݺͿ • UIKitͷओཁͳView͸˓˓NodeʹϦϓϨΠε͞ΕͯΔ https://github.com/TextureGroup/Texture
9. 9.

   Texture΁ͷஔ͖׵͑

10. 10.

    UIKit͔ΒTexture΁ͷஔ͖׵͑ • UITableViewController -> ASViewController<ASTableNode> • ௥ՃಡΈࠐΈ͸
 tableNode(_ tableNode: ASTableNode,

    willBeginBatchFetchWith context: ASBatchContext)
11. 11.

    UIKit͔ΒTexture΁ͷஔ͖׵͑ • UITableViewCell -> ASCellNode • UIView -> ASDisplayNode •

    ViewModel͸ͦͷ··ར༻Մೳ • attributed string΍isHiddenܥͷ஋͸ ViewModelͰ؅ཧ͠View΁όΠϯσΟϯά
12. 12.

    • ଞͷը໘Ͱ΋࢖͍ͬͯΔڞ௨ύʔπ͸࠷ѱ UIViewͷϥοϓͰରԠ • ͨͩ͠ϝΠϯεϨου͕࢖ΘΕΔ UIKit͔ΒTexture΁ͷஔ͖׵͑ node = ASDisplayNode {

    () -> UIView in let view = StarView(frame: CGRect.zero) view.configure(component.displayScore) //configure return view }
13. 13.

    ϨΠΞ΢τ override func layoutSpecThatFits(_ constrainedSize: ASSizeRange) -> ASLayoutSpec { let

    baseStack = ASStackLayoutSpec.vertical() baseStack.spacing = 4.0 // UIStackView.Spacing var verticalElements: [ASLayoutElement] = [] if let messageNode = messageNode { verticalElements.append(messageNode) } verticalElements.append(contentNode) verticalElements.append(footerNode) baseStack.children = verticalElements return ASInsetLayoutSpec( insets: UIEdgeInsets(top: 20, left: 0, bottom: 0, right: 0), child: baseStack ) }
14. 14.

    Textureʹஔ͖׵͑ͨ݁Ռ…

15. 15.

    UIKit Texture ಈը ಈը

16. 16.

    UIKit Texture 30~45fps 50~55fps

17. 17.

    Texture UIKit - Layer Backing
 - Subtree Rasterization View Hierarchy

18. 18.

    ͓ΘΓʹ • TextureΛ࢖ͬͯύϑΥʔϚϯεΛ͋Δఔ౓վળͰ͖ͨ • ϓϩμΫγϣϯίʔυʹ૊ΈࠐΉ͔͸·ͩݕ౼த • xib/storyboard͔Βͷஔ͖׵͑͸ͦ͜·Ͱ೉͘͠ͳ͍ҹ৅ • ը໘୯ҐͰஔ͖׵͑Ͱ͖ΔɻStackLayout͕ศརͰϥΫɻςΩετͷ৭ ΍ϑΥϯτͷ؅ཧΛAttributedStringʹపఈͯ͠Ε͹΋ͬͱϥΫͩͬͨ

    • UIܥϥΠϒϥϦ࢖ͬͯΔͱશஔ͖׵͑͸೉ͦ͠͏ • UIViewΛϥοϓͰ͖Δ͚ͲɺϝΠϯεϨου͕࢖ΘΕΔͷͰϘτϧ ωοΫʹͳΔ͔΋