$30 off During Our Annual Pro Sale. View Details »

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 Slide

  2. SwiftUI
    is not
    UI/AppKit 2

    View 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 Slide

  4. SwiftUI Views
    are recipes

    View 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 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 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 Slide

  8. It's expected
    to struggle when
    learning SwiftUI

    View 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 Slide

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

    View Slide

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

    View 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 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 Slide

  14. SwiftUI is
    slow*

    View 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 Slide

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

    View 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 Slide

  18. UIKit/Appkit
    are not
    going anywhere

    View 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 Slide

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

    View Slide