SwiftUI Academy · Lektion

LazyVStack und LazyHStack

Rendern Sie große Inhalte zur besseren Performance verzögert.

LazyVStack und LazyHStack ist eine kostenlose SwiftUI Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des SwiftUI Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der SwiftUI Academy-Kurs umfasst insgesamt 4 Lektionen.

Teile dieser Lektion wurden noch nicht übersetzt und werden auf Englisch angezeigt.

The Eager Problem

A regular VStack builds every child at once. With hundreds of rows, that eager work can stutter and waste memory.

Meet LazyVStack

A LazyVStack only creates rows as they scroll into view, keeping huge lists fast and light. ⚡

LazyVStack {
    ForEach(items) { item in
        Row(item)
    }
}

Lazy Needs Scrolling

Always place a LazyVStack inside a ScrollView, since lazy loading only pays off when content scrolls offscreen.

ScrollView {
    LazyVStack {
        ForEach(items) { Row($0) }
    }
}

The Horizontal Twin

A LazyHStack does the same trick sideways, perfect for long, swipeable rows of cards or thumbnails.

ScrollView(.horizontal) {
    LazyHStack {
        ForEach(photos) { Thumb($0) }
    }
}

Same Spacing API

Lazy stacks accept the same spacing and alignment options as their eager cousins, so your layout code barely changes.

LazyVStack(alignment: .leading, spacing: 12) {
    ForEach(items) { Row($0) }
}

Cells Get Reused

As rows leave the screen, a LazyVStack can discard them, so memory stays steady even with thousands of items.

Lazy vs List

A List is lazy too, but a LazyVStack gives you styling freedom with no built-in separators or insets.

Pinned Headers

Lazy stacks support pinnedViews, letting section headers stick to the top as you scroll, like a contacts app.

LazyVStack(pinnedViews: [.sectionHeaders]) {
    Section(header: Header()) {
        Rows()
    }
}

When to Stay Eager

For a handful of items a plain VStack is simpler. Reach for lazy only when the list grows long.

Watch the Scroll

You will not see new LazyVStack rows being built, but Instruments shows they appear just in time as you scroll.

Scale with Confidence

With lazy stacks you can show endless feeds, galleries, and timelines without ever worrying about performance. ✨

Quick Check

Think about why lazy stacks exist.

Recap

You met LazyVStack and LazyHStack: stacks that create children on demand inside a ScrollView for smooth, large layouts. 🎉

Häufig gestellte Fragen

Ist die Lektion „LazyVStack und LazyHStack“ kostenlos?

Ja — der vollständige Text von „LazyVStack und LazyHStack“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des SwiftUI Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der SwiftUI Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „LazyVStack und LazyHStack“?

Rendern Sie große Inhalte zur besseren Performance verzögert. Du übst SwiftUI Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um SwiftUI Academy zu starten?

Keine Vorkenntnisse erforderlich. SwiftUI Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 4.

Wie lange dauert die Lektion „LazyVStack und LazyHStack“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser SwiftUI Academy-Lektion Code schreiben und ausführen?

Ja. Jede SwiftUI Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

← Zurück zu SwiftUI Academy