swiftui-patterns

Q: How do I install swiftui-patterns?

Run npx skills add https://github.com/johnrogers/claude-swift-engineering --skill swiftui-patterns in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/swiftui-patterns/ (personal) or .claude/skills/swiftui-patterns/ (project).

by johnrogersMobile

Use when implementing iOS 17+ SwiftUI patterns: @Observable/@Bindable, MVVM architecture, NavigationStack, lazy loading, UIKit interop, accessibility (VoiceOver/Dynamic Type), async operations (.task/.refreshable), or migrating from ObservableObject/@StateObject.

Installs: 258
Last 24h: —
Trending rank: —
Security: Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/johnrogers/claude-swift-engineering --skill swiftui-patterns

01
Install
Run the command in your project. The CLI asks which agents to install for.
02
Describe the task
Ask your agent for something this skill covers. It loads swiftui-patterns automatically when relevant.
03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

SwiftUI Patterns (iOS 17+)

SwiftUI 17+ removes ObservableObject boilerplate with @Observable, simplifies environment injection with @Environment, and introduces task-based async patterns. The core principle: use Apple's modern APIs instead of reactive libraries.

Overview

Quick Reference

Need	Use (iOS 17+)	NOT
Observable model	`@Observable`	`ObservableObject`
Published property	Regular property	`@Published`
Own state	`@State`	`@StateObject`
Passed model (binding)	`@Bindable`	`@ObservedObject`
Environment injection	`environment(_:)`	`environmentObject(_:)`
Environment access	`@Environment(Type.self)`	`@EnvironmentObject`
Async on appear	`.task { }`	`.onAppear { Task {} }`
Value change	`onChange(of:initial:_:)`	`onChange(of:perform:)`

Core Workflow

Use @Observable for model classes (no @Published needed)
Use @State for view-owned models, @Bindable for passed models
Use .task { } for async work (auto-cancels on disappear)
Use NavigationStack with NavigationPath for programmatic navigation
Apply .accessibilityLabel() and .accessibilityHint() to interactive elements

Reference Loading Guide

ALWAYS load reference files if there is even a small chance the content may be required. It's better to have the context than to miss a pattern or make a mistake.

Reference	Load When
Observable	Creating new `@Observable` model classes
State Management	Deciding between `@State`, `@Bindable`, `@Environment`
Environment	Injecting dependencies into view hierarchy
View Modifiers	Using `onChange`, `task`, or iOS 17+ modifiers
Migration Guide	Updating iOS 16 code to iOS 17+
MVVM Observable	Setting up view model architecture
Navigation	Programmatic or deep-link navigation
Performance	Lists with 100+ items or excessive re-renders
UIKit Interop	Wrapping UIKit components (WKWebView, PHPicker)
Accessibility	VoiceOver, Dynamic Type, accessibility actions
Async Patterns	Loading states, refresh, background tasks
Composition	Reusable view modifiers or complex conditional UI

Common Mistakes

Over-using @Bindable for passed models — Creating @Bindable for every property causes unnecessary view reloads. Use @Bindable only for mutable model properties that need two-way binding. Read-only computed properties should use regular properties.
State placement errors — Putting model state in the view instead of a dedicated @Observable model causes view logic to become tangled. Always separate model and view concerns.
NavigationPath state corruption — Mutating NavigationPath incorrectly can leave it in inconsistent state. Use navigationDestination(for:destination:) with proper state management to avoid path corruption.
Missing .task cancellation — .task handles cancellation on disappear automatically, but nested Tasks don't. Complex async flows need explicit cancellation tracking to avoid zombie tasks.
Ignoring environment invalidation — Changing environment values at parent doesn't invalidate child views automatically. Use @Environment consistently and understand when re-renders happen based on observation.
UIKit interop memory leaks — UIViewRepresentable and UIViewControllerRepresentable can leak if delegate cycles aren't broken. Weak references and explicit cleanup are required.

FAQ

What does the swiftui-patterns skill do?

How do I install swiftui-patterns?

Run npx skills add https://github.com/johnrogers/claude-swift-engineering --skill swiftui-patterns in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/swiftui-patterns/ (personal) or .claude/skills/swiftui-patterns/ (project).

Which AI agents can use swiftui-patterns?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is swiftui-patterns safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains swiftui-patterns?

It is published by johnrogers in johnrogers/claude-swift-engineering. It has 258 recorded installs.