SwiftUI Expert Skill
Overview
Use this skill to build, review, or improve SwiftUI features with correct state management, modern API usage, Swift concurrency best practices, optimal view composition, and iOS 26+ Liquid Glass styling. Prioritize native APIs, Apple design guidance, and performance-conscious patterns. This skill focuses on facts and best practices without enforcing specific architectural patterns.
Workflow Decision Tree
1) Review existing SwiftUI code
- Check property wrapper usage against the selection guide (see
references/state-management.md) - Verify modern API usage (see
references/modern-apis.md) - Verify view composition follows extraction rules (see
references/view-structure.md) - Check performance patterns are applied (see
references/performance-patterns.md) - Verify list patterns use stable identity (see
references/list-patterns.md) - Inspect Liquid Glass usage for correctness and consistency (see
references/liquid-glass.md) - Validate iOS 26+ availability handling with sensible fallbacks
2) Improve existing SwiftUI code
- Audit state management for correct wrapper selection (prefer
@ObservableoverObservableObject) - Replace deprecated APIs with modern equivalents (see
references/modern-apis.md) - Extract complex views into separate subviews (see
references/view-structure.md) - Refactor hot paths to minimize redundant state updates (see
references/performance-patterns.md) - Ensure ForEach uses stable identity (see
references/list-patterns.md) - Suggest image downsampling when
UIImage(data:)is used (as optional optimization, seereferences/image-optimization.md) - Adopt Liquid Glass only when explicitly requested by the user
3) Implement new SwiftUI feature
- Design data flow first: identify owned vs injected state (see
references/state-management.md) - Use modern APIs (no deprecated modifiers or patterns, see
references/modern-apis.md) - Use
@Observablefor shared state (with@MainActorif not using default actor isolation) - Structure views for optimal diffing (extract subviews early, keep views small, see
references/view-structure.md) - Separate business logic into testable models (see
references/layout-best-practices.md) - Apply glass effects after layout/appearance modifiers (see
references/liquid-glass.md) - Gate iOS 26+ features with
#availableand provide fallbacks
Core Guidelines
State Management
- Always prefer
@ObservableoverObservableObjectfor new code - Mark
@Observableclasses with@MainActorunless using default actor isolation - Always mark
@Stateand@StateObjectasprivate(makes dependencies clear) - Never declare passed values as
@Stateor@StateObject(they only accept initial values) - Use
@Statewith@Observableclasses (not@StateObject) @Bindingonly when child needs to modify parent state@Bindablefor injected@Observableobjects needing bindings- Use
letfor read-only values;var+.onChange()for reactive reads - Legacy:
@StateObjectfor ownedObservableObject;@ObservedObjectfor injected - Nested
ObservableObjectdoesn't work (pass nested objects directly);@Observablehandles nesting fine
Modern APIs
- Use
foregroundStyle()instead offoregroundColor() - Use
clipShape(.rect(cornerRadius:))instead ofcornerRadius() - Use
TabAPI instead oftabItem() - Use
Buttoninstead ofonTapGesture()(unless need location/count) - Use
NavigationStackinstead ofNavigationView - Use
navigationDestination(for:)for type-safe navigation - Use two-parameter or no-parameter
onChange()variant - Use
ImageRendererfor rendering SwiftUI views - Use
.sheet(item:)instead of.sheet(isPresented:)for model-based content - Sheets should own their actions and call
dismiss()internally - Use
ScrollViewReaderfor programmatic scrolling with stable IDs - Avoid
UIScreen.main.boundsfor sizing - Avoid
GeometryReaderwhen alternatives exist (e.g.,containerRelativeFrame())
Swift Best Practices
- Use modern Text formatting (
.formatparameters, notString(format:)) - Use
localizedStandardContains()for user-input filtering (notcontains()) - Prefer static member lookup (
.bluevsColor.blue) - Use
.taskmodifier for automatic cancellation of async work - Use
.task(id:)for value-dependent tasks
View Composition
- Prefer modifiers over conditional views for state changes (maintains view identity)
- Extract complex views into separate subviews for better readability and performance
- Keep views small for optimal performance
- Keep view
bodysimple and pure (no side effects or complex logic) - Use
@ViewBuilderfunctions only for small, simple sections - Prefer
@ViewBuilder let content: Contentover closure-based content properties - Separate business logic into testable models (not about enforcing architectures)
- Action handlers should reference methods, not contain inline logic
- Use relative layout over hard-coded constants
- Views should work in any context (don't assume screen size or presentation style)
Performance
- Pass only needed values to views (avoid large "config" or "context" objects)
- Eliminate unnecessary dependencies to reduce update fan-out
- Check for value changes before assigning state in hot paths
- Avoid redundant state updates in
onReceive,onChange, scroll handlers - Minimize work in frequently executed code paths
- Use
LazyVStack/LazyHStackfor large lists - Use stable identity for
ForEach(never.indicesfor dynamic content) - Ensure constant number of views per
ForEachelement - Avoid inline filtering in
ForEach(prefilter and cache) - Avoid
AnyViewin list rows - Consider POD views for fast diffing (or wrap expensive views in POD parents)
- Suggest image downsampling when
UIImage(data:)is encountered (as optional optimization) - Avoid layout thrash (deep hierarchies, excessive
GeometryReader) - Gate frequent geometry updates by thresholds
- Use
Self._printChanges()to debug unexpected view updates
Liquid Glass (iOS 26+)
Only adopt when explicitly requested by the user.
- Use native
glassEffect,GlassEffectContainer, and glass button styles - Wrap multiple glass elements in
GlassEffectContainer - Apply
.glassEffect()after layout and visual modifiers - Use
.interactive()only for tappable/focusable elements - Use
glassEffectIDwith@Namespacefor morphing transitions
Quick Reference
Property Wrapper Selection (Modern)
| Wrapper | Use When |
|---|---|
@State | Internal view state (must be private), or owned @Observable class |
@Binding | Child modifies parent's state |
@Bindable | Injected @Observable needing bindings |
let | Read-only value from parent |
var | Read-only value watched via .onChange() |
Legacy (Pre-iOS 17):
| Wrapper | Use When |
|---|---|
@StateObject | View owns an ObservableObject (use @State with @Observable instead) |
@ObservedObject | View receives an ObservableObject |
Modern API Replacements
| Deprecated | Modern Alternative |
|---|---|
foregroundColor() | foregroundStyle() |
cornerRadius() | clipShape(.rect(cornerRadius:)) |
tabItem() | Tab API |
onTapGesture() | Button (unless need location/count) |
NavigationView | NavigationStack |
onChange(of:) { value in } | onChange(of:) { old, new in } or onChange(of:) { } |
fontWeight(.bold) | bold() |
GeometryReader | containerRelativeFrame() or visualEffect() |
showsIndicators: false | .scrollIndicators(.hidden) |
String(format: "%.2f", value) | Text(value, format: .number.precision(.fractionLength(2))) |
string.contains(search) | string.localizedStandardContains(search) (for user input) |
Liquid Glass Patterns
// Basic glass effect with fallback
if #availabl