LazyVStack и LazyHStack
Лениво отображайте большие объёмы содержимого для повышения производительности.
«LazyVStack и LazyHStack» — бесплатный урок SwiftUI Academy на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения SwiftUI Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс SwiftUI Academy содержит 4 уроков всего.
Части этого урока еще не переведены и отображаются на английском.
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. 🎉
Часто задаваемые вопросы
Урок «LazyVStack и LazyHStack» бесплатный?
Да — полный текст урока «LazyVStack и LazyHStack» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс SwiftUI Academy, подпишись на CoddyKit PRO. Курс SwiftUI Academy содержит 4 уроков всего.
Чему я научусь в уроке «LazyVStack и LazyHStack»?
Лениво отображайте большие объёмы содержимого для повышения производительности. Ты практикуешь SwiftUI Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать SwiftUI Academy?
Предыдущий опыт не требуется. SwiftUI Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.
Сколько времени занимает урок «LazyVStack и LazyHStack»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке SwiftUI Academy?
Да. Каждый урок SwiftUI Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Горизонтальный и вертикальный ScrollView
- LazyVStack и LazyHStack
- Адаптивные сетки с LazyVGrid
- ScrollView Reader и якоря