# Lookatitude Guild Mobile React Native > mobile-react-native - Skill: `tomevault-io/lookatitude-guild-mobile-react-native` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/lookatitude-guild-mobile-react-native` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/lookatitude-guild-mobile-react-native/raw - Safety review: pending (external: skill-scanner PASS, skillspector PASS) - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/lookatitude-guild-mobile-react-native --- # mobile-react-native Implements `guild-plan.md §6.1` (mobile · react-native) under `§6.4` engineering principles: the JS thread is a scarce resource, and every bridge hop is paid in frames. ## What you do Write RN / Expo that treats the bridge as the bottleneck it is. Keep renders pure and small, offload heavy work to native modules or worklets (Reanimated / Hermes), and handle platform differences explicitly rather than hoping one code path works. - Use TypeScript with strict mode; `any` is a last resort. - Prefer the New Architecture (TurboModules, Fabric) when the project already uses it; otherwise keep bridge calls batched and rare. - Animate on the UI thread via Reanimated worklets — not via `setState` loops. - Branch platform-specific behavior with `Platform.select` or `.ios.tsx` / `.android.tsx`, never with hidden conditionals. - List rendering: `FlatList` / `FlashList` with stable keys, `getItemLayout`, and virtualization; avoid `ScrollView` for long lists. - Handle permissions, back-button, safe-area, and keyboard behaviors per-platform explicitly. ## Output shape TypeScript source plus native-module notes: 1. **Component(s)** — `.tsx` files, typed props, memoized where it pays off. 2. **Native modules** — any platform code (Swift / Kotlin / Objective-C++), with integration steps. 3. **Platform file pairs** — `.ios.tsx` / `.android.tsx` when divergence is real. 4. **Build notes** — Expo config plugins or bare-workflow Gradle / Podfile changes. 5. **Tests** — Jest + React Native Testing Library for logic, Detox / Maestro note for E2E if relevant. ## Anti-patterns - Rendering on the JS thread when it should be a Reanimated worklet — drops frames. - Excessive bridge traffic — per-frame messages or large JSON blobs over the bridge. - Platform-specific bugs papered over with a silent `if (Platform.OS === 'ios')` buried in logic. - `ScrollView` containing hundreds of items — kills memory on low-end Android. - Inline anonymous components or un-memoized handlers inside hot lists. - `any` spreading through props — types lose meaning. ## Handoff Return the TS source paths and native-module notes to the invoking `mobile` specialist. Deep native work chains into `mobile-ios-swift` or `mobile-android-kotlin`. Performance work lives in `mobile-performance-tuning`. This skill does not dispatch. --- > Source: [lookatitude/guild](https://github.com/lookatitude/guild) — distributed by [TomeVault](https://tomevault.io).