是 iOS Developer 都知道，SwiftUI 實在讓人又愛又恨，雖然有簡單上手的 UI Programming、可以玩 Widget、Live Activity 等 SwiftUI 限定的功能，但一堆華麗的 Bug、與命令式開發大相徑庭的開發模式，實在讓 UIKit 開發者後退三步。

想當初，我也是這樣，想著能用 UIKit 開發就好，但好景不常，公司接下了 SwiftUI 的案子，我也只好下海了。

經過了大約一個月的陣痛期，我漸漸發現自己的開發速度追上、甚至超越過往用 UIKit 開發的速度。

原因有很多個，但最大的原因是「Preview」。

Preview？大家不是早就用到爛掉了嗎？

的確，我剛開始學 iOS 開發時，也是被 SwiftUI 能夠直接在 Canvas 呈現畫面而感到驚艷。但隨著專案愈來愈大，Preview 渲染的速度愈來愈慢，到最後實在受不了，就放棄了 Preview，回到了反覆 Build Code 的日常。

然而，在去年 iPlayground 講者 13 的推坑、加上專案的 UI 複雜度愈來愈高，我又再度把 Preview 拿了回來，才發現 Preview 太方便太爽了！尤其是在「呈現多種狀態」的情況下。

舉例來說：

如果我要做一個代辦事項的 App，一件事情為一個 Item，畫面如下：

假設，我今天要在 Title 後面加上 Tag 的樣式，呈現 4 種不同的進度狀態（已取消 / 已完成 / 待辦 / 進行中），該怎麼做呢？

若是使用 UIKit，過往的我可能要重複 Build Code 去觀察每個狀態的 UI 是否正確。但在 SwiftUI 裡，我可以在 Preview 寫出想看到的不同狀態，快速驗證。

// 寫下四種不同狀態
#Preview {
    VStack {
        ContentView(
            model: .init(
                date: "2025/01/01",
                title: "買花",
                tagType: .cancel)
        )
        
        ContentView(
            model: .init(
                date: "2025/02/01",
                title: "採橘子",
                tagType: .complete)
        )
        
        ContentView(
            model: .init(
                date: "2025/03/01",
                title: "在天上飛",
                tagType: .waitingToDo)
        )
        
        ContentView(
            model: .init(
                date: "2025/04/01",
                title: "去迪士尼",
                tagType: .doing)
        )
    }
}

除此之外，因為在 SwiftUI 畫面是由「狀態改變」而渲染，所以我們也可以很好地測試 UI 的互動！

假設，勾選代辦事項之後，Tag 會轉變成「已完成」，且 icon 會變成打勾，在 Preview 裡也可以很輕鬆的做驗證。

設想看看，如果不開啟 Preview，等到專案的 UI 邏輯愈複雜、狀態愈多，Build Code 的次數也會直線上升，甚至龐大專案的 Build Code 速度也會愈來愈慢！

所以，推薦把 Preview 關起來的開發者們，把 Preview 打開吧，你會得到一個不同的世界～！

有任何想法都可以聯繫我，掰噗～～