Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SwiftUI Lessons

SwiftUI Lessons

Apple's introduction of SwiftUI brought a massive paradigm shift on native iOS and macOS app development.
In this talk, I share the most important lessons learned from building and shipping a dozen apps in SwiftUI for the past three years, coming from a UIKit developer's perspective and reaching hundreds of thousands of users.

20 minutes talk.

Federico Zanetello

January 21, 2022
Tweet

More Decks by Federico Zanetello

Other Decks in Programming

Transcript

  1. SwiftUI
    Lessons
    For UI/AppKit developers
    Federico Zanetello
    ★★★★★ fivestars.blog • @zntfdr

    View full-size slide

  2. SwiftUI
    is not
    UI/AppKit 2

    View full-size slide

  3. SwiftUI is not UIKit/AppKit 2
    » Complete paradigm shift (imperative declarative)
    » We're all starting from scratch
    » Knowledge of earlier UI framework is:
    »
    "
    insightful
    »
    #
    not helpful
    »
    $
    might even be a disadvantage (!!!)

    View full-size slide

  4. SwiftUI Views
    are recipes

    View full-size slide

  5. SwiftUI Views are recipes
    » where we declare how views look
    and behave...
    » ...but no longer manage
    transitions & similar
    » we give up full control on views

    View full-size slide

  6. New way to
    make changes
    via state
    struct FSView: View {
    @State private var backgroundColor: Color = .white
    var body: some View {
    ZStack {
    backgroundColor.ignoresSafeArea()
    Button("Change background color") {
    backgroundColor = [.red, .white, .black]
    .filter { $0 != backgroundColor }
    .randomElement()!
    }
    }
    }
    }

    View full-size slide

  7. New View
    communication
    ways
    » Bindings
    struct FSView: View {
    @State private var isOn = false
    var body: some View {
    Toggle(
    "Enable X",
    isOn: $isOn
    )
    }
    }

    View full-size slide

  8. It's expected
    to struggle when
    learning SwiftUI

    View full-size slide

  9. The SwiftUI struggle
    » even simple things are going to be hard
    » all of us are still figuring it out
    » when people say something is impossible
    in SwiftUI, it means they haven’t
    figured it out yet
    » the struggle is real...until things
    will *just* click

    View full-size slide

  10. Everything
    is a View,
    not every View
    is a view

    View full-size slide

  11. Events are observed and
    delivered to views
    » onAppear
    » onDisappear
    » task
    » onReceive
    » onChange
    » onDrag
    » onDrop
    » onHover
    » onSubmit
    » …

    View full-size slide

  12. Views can be containersα
    struct ContainerView: View {
    @StateObject var model = ContainerModel()
    var body: some View {
    ActualUI(
    elements: model.elements,
    onElementTap: model.onTap(element:)
    )
    .onAppear(perform: model.onAppear)
    }
    }
    α https://swiftwithmajid.com/2019/07/31/introducing-container-views-in-swiftui/

    View full-size slide

  13. SwiftUI coordinator
    architectureβ
    struct FlowCoordinator: View {
    @State private var routes: [Route] = [.root(.firstScreen)]
    var onCompletion: () -> Void
    var body: some View {
    Router($routes) { screen, _ in
    switch screen {
    case .firstScreen:
    FirstScreen(onCompletion: { routes.push(.secondScreen) })
    case .secondScreen:
    SecondScreen(onCompletion: onCompletion)
    }
    }
    }
    }
    β https://github.com/johnpatrickmorgan/FlowStacks

    View full-size slide

  14. SwiftUI is
    slow*

    View full-size slide

  15. SwiftUI is slow*
    » Optimizations become implementation details
    » newer Xcode, faster app!
    !
    » there's a limit to how much we can get for free
    » *SwiftUI is as performant as our code makes it so:
    » The more parameters/states/dependencies a view has, the less performance we
    might getγ
    » Isolate state as much as possibleδ
    » Publish only relevant changes
    » Make each view observe as little as possibleε
    ε https://github.com/cookednick/Observable/
    δ https://www.wwdcnotes.com/notes/wwdc21/10022/
    γ https://www.fivestars.blog/articles/app-state/

    View full-size slide

  16. Feedback ⠀⠀⠀⠀⠀
    Assistantλ ⠀⠀⠀⠀ ⠀
    is your ⠀⠀ ⠀⠀
    (new) friend ⠀
    λ https://feedbackassistant.apple.com

    View full-size slide

  17. Feedback Assistant pro tips
    » Be as narrow and concise as possible
    » File as early as possible
    » Follow-up when new SDKs are out
    » Add reproduction code (for bugs)
    » Bonus: attach a video demo
    » Describe your case (for suggestions)

    View full-size slide

  18. UIKit/Appkit
    are not
    going anywhere

    View full-size slide

  19. UIKit/Appkit are not going
    anywhere
    !
    » SwiftUI uses both AppKit and UIKit behind the scenes
    » SwiftUI is just another tool in our belt
    » it's ok to mix and match!
    » UIViewRepresentable NSViewRepresentable
    » UIViewControllerRepresentable NSViewControllerRepresentable
    » UIHostingController NSHostingController
    » Feel free to experiment!

    View full-size slide

  20. SwiftUI
    Lessons
    For UI/AppKit developers
    Federico Zanetello
    ★★★★★ fivestars.blog • @zntfdr

    View full-size slide