Swift Academy · บทเรียน

มุมมองแบบ Equatable และขอบเขต @State

จำกัดขอบเขตสถานะเพื่อลดการทำให้มุมมองต้องคำนวณใหม่

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

ความเท่ากันช่วยลดงานที่ไม่จำเป็น

หาก SwiftUI พิสูจน์ได้ว่าข้อมูลนำเข้าของมุมมองไม่เปลี่ยนแปลง ก็สามารถข้ามการแสดงผลซ้ำได้ การทำให้มุมมองเป็น Equatable ทำให้ SwiftUI มีวิธีตัดสินใจที่แม่นยำ

การทำให้สอดคล้องกับความเท่ากัน

ทำให้มุมมองของคุณสอดคล้องกับ Equatable แล้ว SwiftUI จะเปรียบเทียบค่าเก่ากับค่าใหม่ หากค่าเท่ากัน ก็จะข้ามการประเมิน body

struct Badge: View, Equatable {
    let count: Int
    var body: some View { Text("\(count)") }
    static func == (a: Badge, b: Badge) -> Bool {
        a.count == b.count
    }
}

EquatableView

คุณยังสามารถครอบมุมมองที่เปรียบเทียบความเท่ากันได้ด้วย .equatable() เพื่อขอให้ข้ามการแสดงผลโดยอาศัยการเปรียบเทียบ โดยไม่ต้องเปลี่ยนจุดเรียกใช้ประเภทนี้ทั้งหมด

Badge(count: total)
    .equatable()

เมื่อการตรวจสอบความเท่ากันมีประโยชน์

ความเท่ากันมีประโยชน์อย่างมากกับมุมมองที่มีข้อมูลนำเข้าซึ่งเปรียบเทียบได้รวดเร็ว แต่มี body ที่ใช้เวลาประมวลผลสูง ต้นทุนการเปรียบเทียบต้องต่ำกว่าต้นทุนการแสดงผลมากจึงจะคุ้มค่า

กับดักของต้นทุนการเปรียบเทียบ

หาก == ของคุณใช้เวลามากเช่นกัน เช่น การเปรียบเทียบอาร์เรย์ขนาดใหญ่แบบลงลึก ก็อาจมีต้นทุนสูงกว่าการแสดงผลที่คุณพยายามข้าม ควรเปรียบเทียบเฉพาะฟิลด์ที่มีต้นทุนต่ำและใช้ตัดสินใจได้ชัดเจน

static func == (a: Self, b: Self) -> Bool {
    a.id == b.id && a.version == b.version // cheap fields
}

ความเท่ากันที่ Swift สร้างให้โดยอัตโนมัติ

หากคุณสมบัติที่จัดเก็บไว้ทั้งหมดเปรียบเทียบความเท่ากันได้ Swift ก็สามารถสร้าง == ให้โดยอัตโนมัติ แต่คลอเชอร์และบางประเภทไม่สามารถเปรียบเทียบความเท่ากันได้ ดังนั้นคุณอาจต้องเขียนการทำงานเองโดยไม่รวมสิ่งเหล่านั้นในการเปรียบเทียบ

struct Card: View, Equatable {
    let title: String
    let onTap: () -> Void // not Equatable
    static func == (a: Card, b: Card) -> Bool { a.title == b.title }
    var body: some View { Text(title) }
}

การจำกัดขอบเขตของ @State

การวางสถานะไว้สูงเกินไปจะทำให้ทุกอย่างด้านล่างแสดงผลใหม่ ให้ย้าย @State ลงไปยังมุมมองที่เล็กที่สุดซึ่งเป็นเจ้าของสถานะนั้น เพื่อให้การเปลี่ยนแปลงส่งผลต่อส่วนติดต่อผู้ใช้น้อยที่สุด

// Move toggle state into the row that uses it
struct Row: View {
    @State private var expanded = false
    var body: some View { /* only this row re-renders */ Text("Row") }
}

ยกสถานะขึ้นเมื่อมีการใช้งานร่วมกันเท่านั้น

ยกสถานะขึ้นก็ต่อเมื่อมีหลายมุมมองที่จำเป็นต้องใช้สถานะนั้นจริง ๆ มิฉะนั้น สถานะภายในมุมมองจะช่วยจำกัดขอบเขตของการแสดงผลใหม่ให้เล็กลง

แยกมุมมองย่อยเพื่อจำกัดการอัปเดต

การแยกส่วนที่เปลี่ยนแปลงบ่อยออกมาเป็นมุมมองของตัวเอง จะจำกัดการประเมินใหม่ไว้เฉพาะมุมมองนั้น และไม่กระทบมุมมองพี่น้อง

struct LiveClock: View {
    @State private var now = Date()
    var body: some View { Text(now, style: .time) }
}

การเชื่อมโยงและขอบเขต

@Binding เชื่อม child เข้ากับสถานะของ parent การส่งการเชื่อมโยงที่แคบ เช่น ช่องข้อมูลเพียงช่องเดียว แทนการส่งวัตถุทั้งหมด จะจำกัดว่าการเปลี่ยนแปลงใดจะถูกส่งต่อ

struct NameField: View {
    @Binding var name: String // narrow binding
    var body: some View { TextField("Name", text: $name) }
}

ผสานความเท่ากันเข้ากับขอบเขต

ผลลัพธ์ที่ดีที่สุดเกิดจากการผสานหลายเทคนิคเข้าด้วยกัน ได้แก่ จำกัดตำแหน่งของสถานะให้แคบเพื่อลดตัวกระตุ้น และใช้ Equatable เพื่อข้ามการแสดงผลที่ยังคงถูกเรียกใช้

ตรวจสอบสั้น ๆ: มุมมองที่เปรียบเทียบความเท่ากันได้

ทดสอบความเข้าใจเกี่ยวกับมุมมองที่เปรียบเทียบความเท่ากันได้และขอบเขตของสถานะ

สรุป: มุมมองที่เปรียบเทียบความเท่ากันได้และขอบเขตของสถานะ

การทำให้มุมมองเป็น Equatable หรือใช้ .equatable() ทำให้ SwiftUI ข้ามการแสดงผลที่ไม่มีการเปลี่ยนแปลงได้ ซึ่งคุ้มค่าเมื่อการเปรียบเทียบมีต้นทุนต่ำกว่าการแสดงผลมาก โดยเลือกเปรียบเทียบเฉพาะฟิลด์ที่ใช้ตัดสินใจได้ชัดเจน

จำกัด @State ไว้ที่มุมมองที่เป็นเจ้าของสถานะและมีขนาดเล็กที่สุด ส่งการเชื่อมโยงที่แคบ และแยกส่วนที่เปลี่ยนแปลงบ่อยออกมาเป็นมุมมองของตัวเอง การผสานขอบเขตสถานะที่แคบเข้ากับความเท่ากันจะให้การแสดงผลใหม่น้อยครั้งที่สุดและมีต้นทุนต่ำที่สุด

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

บทเรียน “มุมมองแบบ Equatable และขอบเขต @State” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “มุมมองแบบ Equatable และขอบเขต @State”

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

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

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

บทเรียน “มุมมองแบบ Equatable และขอบเขต @State” ใช้เวลานานแค่ไหน

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

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

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

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

ทำความเข้าใจเอกลักษณ์ของมุมมอง
ลดการประเมิน Body ซ้ำ
มุมมองแบบ Equatable และขอบเขต @State
การวิเคราะห์ประสิทธิภาพด้วยเครื่องมือ SwiftUI

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