Requirements
- Target platform
- OpenClaw
- Install method
- Manual import
- Extraction
- Extract archive
- Prerequisites
- OpenClaw
- Primary doc
- SKILL.md
Tencent SkillHub ยท Developer Tools
React Native
Build performant cross-platform mobile apps with React Native components, navigation, and native modules.
skill openclawclawhub Free
Build performant cross-platform mobile apps with React Native components, navigation, and native modules.
โฌ 0 downloads โ
0 stars Unverified but indexed
Install for OpenClaw
Quick setup
- Download the package from Yavira.
- Extract the archive and review SKILL.md first.
- Import or place the package into your OpenClaw setup.
Package facts
- Download mode
- Yavira redirect
- Package format
- ZIP package
- Source platform
- Tencent SkillHub
- What's included
- SKILL.md
Validation
- Use the Yavira download entry.
- Review SKILL.md after the package is downloaded.
- Confirm the extracted package contains the expected setup assets.
Install with your agent
Agent handoff
Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.
- Download the package from Yavira.
- Extract it into a folder your agent can access.
- Paste one of the prompts below and point your agent at the extracted folder.
New install
I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Tell me what you changed and call out any manual steps you could not complete.
Upgrade existing
I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Summarize what changed and any follow-up checks I should run.
Trust & source
Release facts
- Source
- Tencent SkillHub
- Verification
- Indexed source record
- Version
- 1.0.0
Provenance
- Publisher
- ivangdavila
- Source page
- View original listing
- Canonical URL
- Open canonical page
Documentation
Component Performance
FlatList for any list over 10 items โ ScrollView with map loads everything in memory, FlatList virtualizes keyExtractor must return stable unique strings โ using index causes bugs on reorder and deletion React.memo prevents re-renders when props unchanged โ wrap pure display components useCallback for functions passed to child components โ new function reference triggers child re-render Avoid inline styles in render โ creates new object every render, extract to StyleSheet.create
State Management
useState is fine for component-local state โ don't add Redux/Zustand for a toggle Lift state to lowest common ancestor only โ higher causes unnecessary re-renders useMemo for expensive computations โ but don't overuse, caching has overhead Context re-renders all consumers on any change โ split contexts by update frequency Avoid storing derived data in state โ compute during render from source state
Navigation
React Navigation is the standard โ Expo Router for file-based routing in Expo projects Stack screens stay mounted by default โ clean up subscriptions and timers in useEffect cleanup Pass serializable params only โ functions and complex objects break deep linking and state persistence useFocusEffect for screen-specific side effects โ runs on focus, not just mount navigation.reset for auth flows โ clears back stack, prevents returning to login after sign-in
Styling
StyleSheet.create outside component body โ creates styles once, not every render Flexbox defaults differ from web โ flexDirection: 'column', no display: flex needed Dimensions in density-independent pixels โ don't use pixel values from design tools directly Platform.select for platform-specific styles โ cleaner than conditionals in style objects No CSS inheritance โ text styles don't cascade, each Text needs explicit styling
Native Modules
Expo modules cover most needs โ avoid ejecting for common features like camera, location, notifications expo-dev-client enables native modules without full eject โ best of both worlds React Native New Architecture (Fabric, TurboModules) is opt-in โ check library compatibility before enabling Native crashes don't show in JS debugger โ check Xcode/Android Studio logs
Performance Debugging
Hermes engine should be enabled โ significantly faster startup and lower memory InteractionManager.runAfterInteractions defers heavy work โ keeps animations smooth useNativeDriver: true for animations โ runs on UI thread, not JS thread console.log in production kills performance โ remove or use __DEV__ guard Flipper for debugging โ network, layout, performance profiling
Images
Use resizeMode appropriately โ cover crops, contain letterboxes, stretch distorts Prefetch images for smooth UX: Image.prefetch(url) before displaying Local images need explicit dimensions โ remote images can use aspect ratio if one dimension set SVGs via react-native-svg โ better scaling than PNGs for icons Cache remote images with react-native-fast-image โ default Image has no persistent cache
Common Mistakes
async in useEffect directly โ must define async function inside, then call it Missing key warnings in lists โ always use unique, stable keys Assuming web React patterns work โ no DOM, no CSS, different event system Forgetting cleanup in useEffect โ subscriptions, timers, listeners leak without cleanup return Testing only on one platform โ iOS and Android differ in behavior, test both regularly
Platform Differences
Android needs explicit overflow: 'hidden' for border radius clipping โ iOS clips by default Shadows: iOS uses shadow* props, Android uses elevation StatusBar behavior differs โ test visibility and color on both platforms Back button is Android-only โ handle with BackHandler or navigation listeners Push notifications setup differs significantly โ platform-specific configuration required
Build & Release
npx react-native clean for unexplained build failures โ clears caches and derived data iOS: cd ios && pod install after adding native dependencies โ often forgotten step Android: cd android && ./gradlew clean for stubborn build issues EAS Build (Expo) simplifies CI/CD โ handles signing, versioning, submission Test release builds locally before submitting โ development and production behavior differ
Category context
Code helpers, APIs, CLIs, browser automation, testing, and developer operations.
Source: Tencent SkillHub
Largest current source with strong distribution and engagement signals.
Package contents
Included in package
1 Docs
- SKILL.md