senior-mobile
Offers expert mobile application development guidance for platforms such as iOS, Android, React Native, and Flutter.
npx skills add borghei/claude-skills --skill senior-mobileBefore / After Comparison
1 组A mobile application developed by an inexperienced team suffered from performance bottlenecks, memory leaks, UI freezes, and fast battery drain, resulting in a poor user experience and low app store ratings.
With guidance from 'senior-mobile' skills, the application underwent comprehensive optimization on iOS, Android, React Native, or Flutter platforms. Performance issues were resolved, achieving smooth UI animations, efficient offline data processing, and lower resource consumption, significantly improving user satisfaction and application quality.
description SKILL.md
senior-mobile
Senior Mobile Developer
Expert mobile application development across iOS, Android, React Native, and Flutter.
Keywords
mobile, ios, android, react-native, flutter, swift, kotlin, swiftui, jetpack-compose, expo-router, zustand, app-store, performance, offline-first
Quick Start
# Scaffold a React Native project
python scripts/mobile_scaffold.py --platform react-native --name MyApp
# Build for production
python scripts/build.py --platform ios --env production
# Generate App Store metadata
python scripts/store_metadata.py --screenshots ./screenshots
# Profile rendering performance
python scripts/profile.py --platform android --output report.html
Tools
Script Purpose
scripts/mobile_scaffold.py
Scaffold project for react-native, ios, android, or flutter
scripts/build.py
Build automation with environment and platform flags
scripts/store_metadata.py
Generate App Store / Play Store listing metadata
scripts/profile.py
Profile rendering, memory, and startup performance
Platform Decision Matrix
Aspect Native iOS Native Android React Native Flutter
Language Swift Kotlin TypeScript Dart
UI Framework SwiftUI/UIKit Compose/XML React Widgets
Performance Best Best Good Very Good
Code Sharing None None ~80% ~95%
Best For iOS-only, hardware-heavy Android-only, hardware-heavy Web team, shared logic Maximum code sharing
Workflow 1: Scaffold a React Native App (Expo Router)
-
Generate project --
python scripts/mobile_scaffold.py --platform react-native --name MyApp -
Verify directory structure matches this layout:
src/
├── app/ # Expo Router file-based routes
│ ├── (tabs)/ # Tab navigation group
│ ├── auth/ # Auth screens
│ └── _layout.tsx # Root layout
├── components/
│ ├── ui/ # Reusable primitives (Button, Input, Card)
│ └── features/ # Domain components (ProductCard, UserAvatar)
├── hooks/ # Custom hooks (useAuth, useApi)
├── services/ # API clients and storage
├── stores/ # Zustand state stores
└── utils/ # Helpers
-
Configure navigation in
app/_layout.tsxwith Stack and Tabs. -
Set up state management with Zustand + AsyncStorage persistence.
-
Validate -- Run the app on both iOS simulator and Android emulator. Confirm navigation and state persistence work.
Workflow 2: Build a SwiftUI Feature (iOS)
-
Create the View using
NavigationStack,@StateObjectfor ViewModel binding, and.taskfor async data loading. -
Create the ViewModel as
@MainActor classwith@Publishedproperties. Inject services via protocol for testability. -
Wire data flow: View observes ViewModel -> ViewModel calls Service -> Service returns data -> ViewModel updates
@Published-> View re-renders. -
Add search/refresh:
.searchable(text:)for filtering,.refreshablefor pull-to-refresh. -
Validate -- Run in Xcode previews first, then simulator. Confirm async loading, error states, and empty states all render correctly.
Example: SwiftUI ViewModel Pattern
@MainActor
class ProductListViewModel: ObservableObject {
@Published private(set) var products: [Product] = []
@Published private(set) var isLoading = false
@Published private(set) var error: Error?
private let service: ProductServiceProtocol
init(service: ProductServiceProtocol = ProductService()) {
self.service = service
}
func loadProducts() async {
isLoading = true
error = nil
do {
products = try await service.fetchProducts()
} catch {
self.error = error
}
isLoading = false
}
}
Workflow 3: Build a Jetpack Compose Feature (Android)
-
Create the Composable screen with
Scaffold,TopAppBar, and state collection viacollectAsStateWithLifecycle(). -
Handle UI states with a sealed interface:
Loading,Success<T>,Error. -
Create the ViewModel with
@HiltViewModel,MutableStateFlow, and repository injection. -
Build list UI using
LazyColumnwithkeyparameter for stable identity andArrangement.spacedBy()for spacing. -
Validate -- Run on emulator. Confirm state transitions (loading -> success, loading -> error -> retry) work correctly.
Example: Compose UiState Pattern
sealed interface UiState<out T> {
data object Loading : UiState<Nothing>
data class Success<T>(val data: T) : UiState<T>
data class Error(val message: String) : UiState<Nothing>
}
@HiltViewModel
class ProductListViewModel @Inject constructor(
private val repository: ProductRepository
) : ViewModel() {
private val _uiState = MutableStateFlow<UiState<List<Product>>>(UiState.Loading)
val uiState: StateFlow<UiState<List<Product>>> = _uiState.asStateFlow()
fun loadProducts() {
viewModelScope.launch {
_uiState.value = UiState.Loading
repository.getProducts()
.catch { e -> _uiState.value = UiState.Error(e.message ?: "Unknown error") }
.collect { products -> _uiState.value = UiState.Success(products) }
}
}
}
Workflow 4: Optimize Mobile Performance
-
Profile --
python scripts/profile.py --platform <ios|android> --output report.html -
Apply React Native optimizations:
Use FlatList with keyExtractor, initialNumToRender=10, windowSize=5, removeClippedSubviews=true
-
Memoize components with
React.memoand handlers withuseCallback -
Supply
getItemLayoutfor fixed-height rows to skip measurement -
Apply native iOS optimizations:
Implement prefetchItemsAt for image pre-loading in collection views
- Apply native Android optimizations:
Set setHasFixedSize(true) and setItemViewCacheSize(20) on RecyclerViews
- Validate -- Re-run profiler and confirm frame drops reduced and startup time improved.
Workflow 5: Submit to App Store / Play Store
-
Generate metadata --
python scripts/store_metadata.py --screenshots ./screenshots -
Build release --
python scripts/build.py --platform ios --env production -
Review the generated listing (title, description, keywords, screenshots).
-
Upload via Xcode (iOS) or Play Console (Android).
-
Validate -- Monitor review status and address any rejection feedback.
Reference Materials
Document Path
React Native Guide references/react_native_guide.md
iOS Patterns references/ios_patterns.md
Android Patterns references/android_patterns.md
App Store Guide references/app_store_guide.md
Full Code Examples REFERENCE.md
Weekly Installs247Repositoryborghei/claude-skillsGitHub Stars42First SeenJan 23, 2026Security AuditsGen Agent Trust HubPassSocketPassSnykPassInstalled onopencode205gemini-cli192codex187github-copilot182cursor178claude-code176
forumUser Reviews (0)
Write a Review
No reviews yet
Statistics
User Rating
Rate this Skill