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.

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