affaan-m/swiftui-patterns

SwiftUI 架构模式、基于 @Observable 的状态管理、视图组合、导航、性能优化，以及现代 iOS/macOS UI 最佳实践。在构建或审查 SwiftUI 视图、@Observable 状态、导航或渲染性能时使用。

编程协作开发 Agent Agent 技能调研 SwiftUI 架构状态管理视图组合导航设计性能优化

技术栈: cursor24万+许可证: MIT开发者: affaan-m

Skill 介绍Skill 文件

重要提示：本站仅作 Skill 资源导航与收录，正文以 GitHub 原仓库为准，版权归原项目所有。

在 GitHub 查看 ↗

原文译文

以下为摘要预览，完整内容请查看 GitHub 原文。

SwiftUI Patterns

Modern SwiftUI patterns for building declarative, performant user interfaces on Apple platforms. Covers the Observation framework, view composition, type-safe navigation, and performance optimization.

When to Activate

Building SwiftUI views and managing state (@State, @Observable, @Binding)
Designing navigation flows with NavigationStack
Structuring view models and data flow
Optimizing rendering performance for lists and complex layouts
Working with environment values and dependency injection in SwiftUI

State Management

Property Wrapper Selection

Choose the simplest wrapper that fits:

Wrapper	Use Case
`@State`	View-local value types (toggles, form fields, sheet presentation)
`@Binding`	Two-way reference to parent's `@State`
`@Observable` class + `@State`	Owned model with multiple properties
`@Observable` class (no wrapper)	Read-only reference passed from parent
`@Bindable`	Two-way binding to an `@Observable` property
`@Environment`	Shared dependencies injected via `.environment()`

@Observable ViewModel

Use @Observable (not ObservableObject) — it tracks pr…

以下为摘要预览，完整内容请查看 GitHub 原文。

SwiftUI Patterns

在 Apple 平台上构建声明式、高性能用户界面的现代 SwiftUI 模式。涵盖 Observation 框架、视图组合、类型安全的导航以及性能优化。

何时启用

构建 SwiftUI 视图并管理状态（@State、@Observable、@Binding）
使用 NavigationStack 设计导航流程
搭建视图模型与数据流结构
优化列表与复杂布局的渲染性能
在 SwiftUI 中处理环境值与依赖注入

状态管理

选择属性包装器

选用最贴合需求的、最简单的包装器：

包装器	适用场景
`@State`	视图局部的值类型（开关、表单字段、Sheet 展示）
`@Binding`	对父级 `@State` 的双向引用
`@Observable` 类 + `@State`	自有模型，包含多个属性
`@Observable` 类（无包装器）	由父级传入的只读引用
`@Bindable`	对 `@Observable` 属性的双向绑定
`@Environment`	通过 `.environment()` 注入的共享依赖

@Observable ViewModel

使用 @Observable（而非 ObservableObject）——它会按属性粒度追踪变化，因此 SwiftUI 仅重渲染读取了被更改属性的视图：

@Observable
final class ItemListViewModel {
    private(set) var items: [Item] = []
    private(set) var isLoading = false
    var searchText = ""

    private let repository: any ItemRepository

    init(repository: any ItemRepository = DefaultItemRepository()) {
        self.repository = repository
    }

    func load() async {
        isLoading = true
        defer { isLoading = false }
        items = (try? await repository.fetchAll()) ?? []
    }
}