Converting from @StateObject to .task

To upgrade old Combine code in an ObservableObject that had its lifetime tied to a SwiftUI View using @StateObject we can replace it with .task and since async/await gives us a lifetime like a reference type we can do away with the object altogether.

In the Combine version of the code below there is a calculator object that takes 2 inputs and returns the result of adding them together with a simulated delay. After all that is the reason we even need an object in the first place, where there is something asynchronous happening. Otherwise we could have just done the calculation in a @State struct. Here is the code for the Combine version:

struct Input: Equatable {
  var a = 0
  var b = 0
}

class SlowCalculator: ObservableObject {
  @Published var input = Input()
  @Published var result = 0
  
  init() {
    $input
      .debounce(for: 1, scheduler: RunLoop.main) // simulate slow calculation
      .map { input in
        input.a + input.b
      }
      .assign(to: &$result)
  }
}


struct ContentView: View {
  @StateObject var calculator = SlowCalculator()
  
  var body: some View {
    List {
      TextField("", value: $calculator.input.a, format: .number)
      TextField("", value: $calculator.input.b, format: .number)
      Text(calculator.result, format: .number)
    }
  }
}

To covert from Combine we remove the @StateObject, move the input out of the object into @State. Move the logic into an async func in a new struct and call it form a .task modifier. The version of .task that takes an id will cancel and restart the task when the id param changes. This is the same behaviour as the Combine pipeline version that begins with $input publisher. The code for teh async/await version is:

struct SlowCalculator2 {
  func result(for input: Input) async throws -> Int {
    try await Task.sleep(for: .seconds(1)) // simulate slow calculation
    return input.a + input.b
  }
}

struct ContentView2: View {
  
  @State var input = Input()
  @State var result = 0
  
  var body: some View {
    List {
      TextField("", value: $input.a, format: .number)
      TextField("", value: $input.b, format: .number)
      Text(result, format: .number)
    }
    .task(id: input) {
      let calculator = SlowCalculator2()
      do {
        result = try await calculator.result(for: input)
      }
      catch {}
    }
  }
}

The great thing about this design is the SlowCalculator2 struct could be an @Environment var which would allow it to be mocked with a different implementation for previews. This is handy if the calculation logic involved a network request which you did not want to happen during previews.

As a bonus I thought I’d demonstrate how you would implement sharing the calculator with completely separate parts of the View hierarchy. We can’t use .task for that because it is tied to the UI on screen, i.e. it runs on appear and is cancelled with a cancellation exception on dissapear. To solve this we need to do the Task management manually in our own object that is shared around.

@Observable
class SlowCalculator3 {
  static let shared = SlowCalculator3()
  
  @ObservationIgnored
  var task: Task<Void, Never>?
  
  var input = Input() {
    didSet {
      task?.cancel()
      task = Task {
        let calculator = SlowCalculator2()
        do {
          result = try await calculator.result(for: input)
        }
        catch {}
      }
    }
  }
  
  var result = 0
}

struct ContentView3: View {
  let calculator = SlowCalculator3.shared
  
  var body: some View {
    List {
      @Bindable var calculator = calculator
      TextField("", value: $calculator.input.a, format: .number)
      TextField("", value: $calculator.input.b, format: .number)
      Text(calculator.result, format: .number)
    }
  }
}