swiftui-patterns
Explore contemporary SwiftUI architecture through practical state management examples built around the @Observable macro. This collection demonstrates how to structure reactive components and manage data flow efficiently in modern iOS applications, helping developers move beyond legacy patterns.
swiftui-patterns teaches that @Observable is SwiftUI's modern state management macro, replacing ObservableObject for cleaner syntax. Mark your model class with @Observable, then reference it directly in views without @StateObject. The macro automatically tracks property changes and triggers view updates only when accessed properties change, reducing unnecessary re-renders and simplifying dependency injection across your app.
AI-generated summary based on this skill's SKILL.md
Install
xu-xiang/everything-claude-code-zh/swiftui-patterns · repository language: JavaScript
git clone https://github.com/xu-xiang/everything-claude-code-zh
cp -r everything-claude-code-zh/skills/swiftui-patterns ~/.claude/skills/swiftui-patternsFrequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How do you use @Observable in SwiftUI for state management?
swiftui-patterns teaches that @Observable is SwiftUI's modern state management macro, replacing ObservableObject for cleaner syntax. Mark your model class with @Observable, then reference it directly in views without @StateObject. The macro automatically tracks property changes and triggers view updates only when accessed properties change, reducing unnecessary re-renders and simplifying dependency injection across your app.
What are the best practices for SwiftUI state management?
swiftui-patterns emphasizes using @Observable for view models, @State for local view state, and @Environment for injected dependencies. Avoid ObservableObject when possible. Keep state as close to where it's used as possible, use @Binding to pass state down, and leverage @Query for data fetching. This layered approach prevents over-rendering and maintains clear data flow in scalable architectures.
How does NavigationStack enable type-safe routing in SwiftUI?
swiftui-patterns shows that NavigationStack replaces NavigationLink with a data-driven approach using a NavigationPath or typed array. Define your route as an enum, bind the stack to your state, and push routes programmatically. This pattern provides compile-time safety, easier testing, and centralized navigation logic—essential for building maintainable multi-screen apps.
What view composition patterns improve SwiftUI performance?
swiftui-patterns demonstrates using LazyVStack and LazyHStack for large lists, extracting subviews to reduce body complexity, and applying @ViewBuilder for conditional composition. Stable identifiers in ForEach prevent re-creation of views, and custom view modifiers encapsulate reusable styles. These patterns minimize view hierarchy depth and prevent unnecessary recalculation of expensive views.
How should you structure dependency injection in SwiftUI?
swiftui-patterns recommends injecting dependencies through @Environment and initializer parameters rather than global singletons. Use @Observable models as environment objects, pass them explicitly to child views, and leverage @Query for database access. This approach improves testability, reduces coupling, and makes data dependencies explicit and traceable throughout your view hierarchy.
What modern SwiftUI architecture patterns should you adopt in 2024?
swiftui-patterns advocates for @Observable-based view models, NavigationStack for routing, and environment-driven dependency injection. Combine these with task-based async/await for data loading and stable ForEach identifiers for list rendering. This contemporary approach eliminates legacy patterns, improves performance, and creates scalable, testable architectures aligned with current SwiftUI best practices.
SKILL.md
rendered from the published skill — quoted content, verbatim
SwiftUI 模式 (SwiftUI Patterns)
在 Apple 平台上构建声明式、高性能用户界面的现代 SwiftUI 模式。涵盖 Observation 框架、视图组合、类型安全导航以及性能优化。
何时激活
- 构建 SwiftUI 视图并管理状态（
@State,@Observable,@Binding） - 使用
NavigationStack设计导航流 - 构建视图模型（View Model）和数据流
- 针对列表和复杂布局优化渲染性能
- 在 SwiftUI 中使用环境值（Environment Values）和依赖注入
状态管理 (State Management)
属性包装器选择 (Property Wrapper Selection)
选择最适合的简单包装器：
| 包装器 (Wrapper) | 使用场景 |
|---|---|
@State |
视图局部值类型（开关、表单字段、Sheet 弹出状态） |
@Binding |
对父视图 @State 的双向引用 |
@Observable 类 + @State |
拥有多个属性的自有模型 |
@Observable 类 (无包装器) |
从父视图传递的只读引用 |
@Bindable |
对 @Observable 属性的双向绑定 |
@Environment |
通过 .environment() 注入的共享依赖 |
@Observable 视图模型 (ViewModel)
使用 @Observable（而非 ObservableObject）——它能追踪属性级别的变化，因此 SwiftUI 仅重新渲染读取了已更改属性的视图：
```swift @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()) {
(truncated - see the full file via the links below)
Read as markdown · JSON record · Browse the source repository
File tree — 1 file
skills/swiftui-patterns/SKILL.md