Performance of SwiftUI Views with Conditional Branching

Fri, 22 Nov 2024 13:03:00 -0700

Improve the performance of your SwiftUI views by replacing if-else and switch statements with the ternary operator.

To illustrate the issue, let’s start with the following code that uses an if-else statement to set the foreground color of an image:

struct ContentView: View {
    @State private var isFavorite = true

    var body: some View {
        if isFavorite {
            Image(systemName: "star.fill")
                .foregroundStyle(Color.yellow)
        } else {
            Image(systemName: "star.fill")
                .foregroundStyle(Color.black)
        }
    }
}

The above code has two issues. First, there is some duplicate code. Second, toggling isFavorite between true and false causes SwiftUI to tear down and recreate the entire view. SwiftUI treats the if-else paths as separate Views and will do extra work to process the if and else paths. The same performance issue occurs with switch statements.

SwiftUI Toggle

Tue, 22 Feb 2022 11:53:00 -0800

This article describes how to use the SwiftUI Toggle. By the end of the article you will have learned how to embed Toggle in a child View and perform the Toggle’s action in a parent View.

Let’s start with the basics. Here is a variation of the example in the official documentation:

@State private var faceIdEnabled = false
var body: some View {
    Toggle(isOn: $faceIdEnabled) {
        Text("Face ID")
    }
}

The above code will show a toggle control with “Face ID” for the title. By using a two-way binding on faceIdEnabled, we control if the toggle is on or off.

SwiftUI on Robert Harrison

Performance of SwiftUI Views with Conditional Branching

SwiftUI Toggle