SwiftUI Academy · Aula

LazyVStack e LazyHStack

Renderize conteúdo extenso de forma preguiçosa para obter desempenho.

LazyVStack e LazyHStack é uma aula grátis de SwiftUI Academy no CoddyKit. Esta é a aula 2 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de SwiftUI Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de SwiftUI Academy inclui 4 aulas no total.

Partes desta aula ainda não foram traduzidas e aparecem em inglês.

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. 🎉

Perguntas Frequentes

A aula “LazyVStack e LazyHStack” é grátis?

Sim — o texto completo de “LazyVStack e LazyHStack” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de SwiftUI Academy, atualize para CoddyKit PRO. O curso de SwiftUI Academy inclui 4 aulas no total.

O que vou aprender em “LazyVStack e LazyHStack”?

Renderize conteúdo extenso de forma preguiçosa para obter desempenho. Você pratica SwiftUI Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar SwiftUI Academy?

Nenhuma experiência prévia é necessária. SwiftUI Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 2 de 4.

Quanto tempo leva a aula “LazyVStack e LazyHStack”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de SwiftUI Academy?

Sim. Cada aula de SwiftUI Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

← Voltar para SwiftUI Academy