SwiftUI Academy · บทเรียน

โหลดเนื้อหาหนักแบบขี้เกียจ

เลื่อนงานที่ใช้ทรัพยากรมากออกไปจนกว่าจะมองเห็น

โหลดเนื้อหาหนักแบบขี้เกียจ เป็นบทเรียน SwiftUI Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน SwiftUI Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส SwiftUI Academy มีบทเรียนทั้งหมด 4 บทเรียน

บางส่วนของบทเรียนนี้ยังไม่ได้รับการแปล และแสดงเป็นภาษาอังกฤษ

Build Only What Is Visible

Rendering a thousand off-screen rows is wasteful. Lazy containers build views only as they scroll into view, saving huge amounts of work.

Eager vs Lazy Stacks

A plain VStack builds every child up front. Inside a ScrollView with many items, that startup cost can freeze the screen.

Reach for LazyVStack

Swap in LazyVStack inside a ScrollView. It defers creating each row until that row is about to appear on screen.

ScrollView {
    LazyVStack {
        ForEach(items) { RowView(item: $0) }
    }
}

List Is Lazy Too

A List recycles rows automatically, much like a lazy stack. For long, simple feeds it is often the easiest fast choice.

Lazy Grids for Cards

For galleries, use LazyVGrid. It lays out cards in columns and only builds the cells currently in the viewport.

LazyVGrid(columns: cols) {
    ForEach(photos) { Thumb(photo: $0) }
}

Load Images Asynchronously

Heavy images should not block the main thread. AsyncImage fetches and decodes off-screen, showing a placeholder until ready.

AsyncImage(url: photo.url) { img in
    img.resizable()
} placeholder: { ProgressView() }

Downsample Big Images

A full-resolution photo in a small cell wastes memory. Downsample to the displayed size so scrolling stays smooth.

Defer Expensive Work

Compute heavy values when a row first appears, not for all rows at once. The onAppear hook lets you start that work just in time.

RowView(item: item)
    .onAppear { item.prefetch() }

Paginate Long Data

Do not load ten thousand records at once. Paginate: fetch the next page as the user nears the bottom of the list.

Lazy Has a Trade-off

Lazy views forget off-screen content, so building it again on scroll-back costs work. Keep each cell's body light to stay smooth.

Combine the Techniques

Real apps stack these: lazy containers, async images, and pagination together keep memory low and frames steady.

Quick Check

What is the main benefit of LazyVStack over VStack in a long scroll?

Recap: Lazy Loading

You learned to defer work with lazy containers, load images asynchronously, and paginate data so heavy content scrolls without stutter. 🚀

คำถามที่พบบ่อย

บทเรียน “โหลดเนื้อหาหนักแบบขี้เกียจ” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “โหลดเนื้อหาหนักแบบขี้เกียจ” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส SwiftUI Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส SwiftUI Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “โหลดเนื้อหาหนักแบบขี้เกียจ”

เลื่อนงานที่ใช้ทรัพยากรมากออกไปจนกว่าจะมองเห็น คุณปฏิบัติ SwiftUI Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน SwiftUI Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน SwiftUI Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน

บทเรียน “โหลดเนื้อหาหนักแบบขี้เกียจ” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน SwiftUI Academy นี้ได้ไหม

ได้ บทเรียน SwiftUI Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

← กลับไปที่ SwiftUI Academy