移动开发。iOS、Android、SwiftUI、Jetpack Compose、React Native、Flutter、跨平台。当用户提到移动开发、iOS、Android、跨平台时路由到此。
50
54%
Does it follow best practices?
Run evals on this skill
Adds up to 20 points to the overall score
View guide
Passed
No findings from the security scan
Fix and improve this skill with Tessl
tessl review fix ./templates/skills/domains/mobile/SKILL.md原生开发 跨平台开发
├── iOS (SwiftUI/UIKit) ├── React Native (JS/TS)
├── Android (Compose/Kotlin) └── Flutter (Dart)
└── 共通:MVVM / 网络层 / 持久化 / 测试struct MyView: View { var body: some View { ... } }@State — 本地状态@Binding — 父子双向绑定@StateObject — 拥有 ObservableObject@ObservedObject — 引用 ObservableObject@EnvironmentObject / @Environment — 全局注入@Published 属性自动触发 UI 更新struct CardModifier: ViewModifier + extension View { func cardStyle() }.task { await ... } / .onAppear / .onDisappearNSLayoutConstraint.activate([...]) + translatesAutoresizingMaskIntoConstraints = falseURLSession.shared.dataTaskPublisher → map → decode → eraseToAnyPublisher.sink(receiveCompletion:receiveValue:) + .store(in: &cancellables)debounce / removeDuplicates / combineLatest / flatMapPassthroughSubject(无初始值)/ CurrentValueSubject(有初始值)MVVM(推荐):
Codable 数据结构protocol + async throws 方法@MainActor class VM: ObservableObject + @Published 属性@StateObject private var viewModel = VM()VIPER(复杂场景):
func get<T: Decodable>(_ path:) async throws -> Trequest.setValue("Bearer \(token)", forHTTPHeaderField: "Authorization")enum APIError: Error { case invalidURL, invalidResponse, httpError(Int) }@propertyWrapper struct UserDefault<T> 简化访问SecItemAdd / SecItemCopyMatching 存储敏感数据NSPersistentContainer + NSManagedObjectContext@Model 宏简化持久化@MainActor 确保 UI 线程安全@Composable fun MyScreen() { ... }remember { mutableStateOf(value) } — 本地状态rememberSaveable — 跨配置变更保存derivedStateOf — 派生状态避免重组items(list, key = { it.id }) 提供稳定 keyLaunchedEffect(key) — 启动协程DisposableEffect(key) — 清理资源(onDispose)SideEffect — 同步状态到外部snapshotFlow { state } — 监听状态变化转 FlowNavHost + composable(route) + navController.navigate()fun Modifier.myModifier(): Modifier = composed { ... }MutableStateFlow(UiState()) + .asStateFlow()_uiState.update { it.copy(isLoading = true) }val uiState by viewModel.uiState.collectAsState()viewModelScope.launch { withContext(Dispatchers.IO) { ... } }coroutineScope { val a = async { ... }; val b = async { ... } }flow { emit(value) } + .flowOn(Dispatchers.IO).stateIn(scope, SharingStarted.WhileSubscribed(5000), initial)searchQuery.debounce(300).filter { it.isNotEmpty() }.flatMapLatest { ... }Channel<Event>(BUFFERED) + .receiveAsFlow() 一次性事件@HiltAndroidApp Application + @AndroidEntryPoint Activity@Module @InstallIn(SingletonComponent::class) 提供依赖@Provides @Singleton 提供实例 / @Binds 绑定接口@HiltViewModel class VM @Inject constructor(repo) + hiltViewModel()@Entity(tableName) + @PrimaryKey + @ColumnInfo@Query / @Insert(onConflict = REPLACE) / @Delete + 返回 Flow<List<T>>@Database(entities, version) + Room.databaseBuilder@GET / @POST / @Path / @Query / @Body / @MultipartaddInterceptor + connectTimeoutkey 参数优化 LazyColumnremember / derivedStateOf 避免过度重组| 维度 | React Native | Flutter |
|---|---|---|
| 语言 | TypeScript | Dart |
| 渲染 | 原生组件(桥接) | 自绘引擎(Skia) |
| 性能 | 接近原生 | 接近原生 |
| 热重载 | Fast Refresh | Hot Reload |
| 生态 | npm(成熟) | pub.dev(快速增长) |
| UI 一致性 | 跟随系统 | 完全一致 |
| 包体积 | ~7MB | ~15MB |
FlatList + keyExtractor + initialNumToRender + windowSize@react-navigation/native + createNativeStackNavigatorcreateSlice + createAsyncThunk)/ ZustandNativeModules 调用 iOS(Swift) / Android(Kotlin) 原生代码React.memo / Hermes 引擎 / 新架构 JSI(无桥接序列化)setStateChangeNotifier + Consumer / context.watchFutureProvider / StateNotifierProvider + ref.watchGoRoute + context.go/push/pop)MethodChannel + Platform Channels(iOS Swift / Android Kotlin)const 构造函数 / ListView.builder / RepaintBoundary / ValueKey| 场景 | 推荐 | 理由 |
|---|---|---|
| 团队有 Web 背景 | React Native | 学习成本低 |
| 追求极致性能/动画 | Flutter | 自绘引擎 60fps |
| UI 高度定制 | Flutter | 完全控制渲染 |
| 大量原生交互 | React Native | 桥接生态成熟 |
| 需要原生极致体验 | 原生开发 | 无桥接开销 |
| 实践 | 说明 |
|---|---|
| MVVM 架构 | 分离 UI / 业务逻辑 / 数据层 |
| 依赖注入 | Hilt(Android) / Protocol(iOS) / Context(RN) |
| 响应式状态 | StateFlow / Combine / Hooks / Riverpod |
| 网络层封装 | 统一错误处理 + Token 管理 + 重试 |
| 本地持久化 | Room / Core Data / AsyncStorage / Hive |
| 列表优化 | 懒加载 + 稳定 key + 缓存 |
| 测试覆盖 | ViewModel 单元测试 + UI 测试关键流程 |
iOS、SwiftUI、UIKit、Combine、Android、Jetpack Compose、Kotlin、React Native、Flutter、跨平台、移动开发、MVVM
f349e3d
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.