Hur optimerar du SwiftUI-prestanda kring vyidentitet och diffing?

Question

IT Interview Practice · Accepted Answer

SwiftUI kör `body` på nytt närhelst observerat tillstånd ändras, och **diffar** sedan det nya vyträdet mot det gamla och uppdaterar bara det som skiljer sig. Prestandaproblem kommer från att få den diffen att göra för mycket arbete: instabil **identitet**, alltför bred **observation**, och dyra `body`-beräkningar. Åtgärda det genom att kontrollera identitet, avgränsa tillstånd och hålla `body` billig.

## Hur diffing och identitet fungerar

SwiftUI matchar vyer mellan renderingar via **identitet**. För listor är detta `id`; om id:t är instabilt kastar SwiftUI bort och bygger om vyn (förlorar tillstånd och animationer) istället för att uppdatera den.

```swift
// BAD: array index as id — reorders/inserts break identity, full rebuild
ForEach(items.indices, id: \.self) { i in Row(items[i]) }

// GOOD: stable identity tied to the data
ForEach(items) { item in Row(item) }      // items: Identifiable, stable id
```

## Avgränsa observation

Ett `ObservableObject` renderar om **varje** vy som observerar det närhelst **någon** `@Published`-egenskap ändras. Dela upp stora modeller, eller gå över till **Observation-ramverket** (`@Observable`, iOS 17+), som spårar läsningar *per egenskap* så att en vy bara renderas om när en egenskap den faktiskt använde ändras.

```swift
@Observable final class Feed {     // iOS 17: fine-grained dependency tracking
    var unreadCount = 0            // a view reading only .posts won't re-render on this
    var posts: [Post] = []
}
```

## Att hålla body billig

`body` körs ofta, så gör aldrig tungt arbete inline:

```swift
var body: some View {
    List(sortedItems) { ... }      // BAD if sortedItems sorts on every render
}
// GOOD: compute derived data in the model, not in body
```

- Extrahera delvyer så att en tillståndsändring renderar om en **liten** vy, inte hela skärmen.
- Använd `LazyVStack`/`List` för stora samlingar så att rader utanför skärmen inte byggs.
- Lägg till `.equatable()` eller `EquatableView` för att kortsluta diffing på stabila delträd.

## Fallgropar

- `AnyView` raderar typidentitet och omintetgör strukturell diffing — undvik den i heta kodvägar.
- Att skicka en ny closure/array-literal vid varje rendering kan invalidera barnvyer i onödan.

## Varför det är viktigt

På en 120Hz ProMotion-skärm har du ~8ms per bildruta; en `body` som sorterar en stor array eller renderar om en hel lista tappar bildrutor och hackar vid scroll. Senior-intervjuer undersöker vyidentitet och observationsomfång eftersom det är där riktiga SwiftUI-appar blir långsamma — och där några få precisa åtgärder återställer mjukheten.

Hur diffing och identitet fungerar

Avgränsa observation

Att hålla body billig

Fallgropar

Varför det är viktigt

Relaterade frågor