[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-callstack-react-native-best-practices":3,"mdc--jmhzha-key":34,"related-repo-callstack-react-native-best-practices":2246,"related-org-callstack-react-native-best-practices":2351},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":12,"stars":23,"repoUrl":24,"updatedAt":25,"license":26,"forks":27,"topics":28,"repo":29,"sourceUrl":32,"mdContent":33},"react-native-best-practices","optimize React Native app performance","Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. Applies to tasks involving Hermes optimization, JS thread blocking, bridge overhead, FlashList, native modules, or debugging jank and frame drops.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},"callstack","Callstack","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fcallstack.png","callstackincubator",[13,17,20],{"name":14,"slug":15,"type":16},"Performance","performance","tag",{"name":18,"slug":19,"type":16},"React Native","react-native",{"name":21,"slug":22,"type":16},"Mobile","mobile",1527,"https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Fagent-skills","2026-04-06T18:06:41.158478","MIT",109,[],{"repoUrl":24,"stars":23,"forks":27,"topics":30,"description":31},[],"A collection of agent-optimized React Native skills for AI coding assistants.","https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Fagent-skills\u002Ftree\u002FHEAD\u002Fskills\u002Freact-native-best-practices","---\nname: react-native-best-practices\ndescription: Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. Applies to tasks involving Hermes optimization, JS thread blocking, bridge overhead, FlashList, native modules, or debugging jank and frame drops.\nlicense: MIT\nmetadata:\n  author: Callstack\n  tags: react-native, expo, performance, optimization, profiling\n---\n\n# React Native Best Practices\n\n## Overview\n\nPerformance optimization guide for React Native applications, covering JavaScript\u002FReact, Native (iOS\u002FAndroid), and bundling optimizations. Based on Callstack's \"Ultimate Guide to React Native Optimization\".\n\n## When to Apply\n\nReference these guidelines when:\n- Debugging slow\u002Fjanky UI or animations\n- Investigating memory leaks (JS or native)\n- Optimizing app startup time (TTI)\n- Reducing bundle or app size\n- Writing native modules (Turbo Modules)\n- Profiling React Native performance\n- Reviewing React Native code for performance\n\n## Security Notes\n\n- Treat shell commands in these references as local developer operations. Review them before running, prefer version-pinned tooling, and avoid piping remote scripts directly to a shell.\n- Treat third-party libraries and plugins as dependencies that still require normal supply-chain controls: pin versions, verify provenance, and update through your standard review process.\n- Treat remote chunk loading as first-party artifact delivery only. Prefer app-bundled chunks or signed CI release manifests; hosted chunks must come from trusted HTTPS origins you control and be pinned to the current app release.\n\n## Priority-Ordered Guidelines\n\n| Priority | Category | Impact | Prefix |\n|----------|----------|--------|--------|\n| 1 | FPS & Re-renders | CRITICAL | `js-*` |\n| 2 | Bundle Size | CRITICAL | `bundle-*` |\n| 3 | TTI Optimization | HIGH | `native-*`, `bundle-*` |\n| 4 | Native Performance | HIGH | `native-*` |\n| 5 | Memory Management | MEDIUM-HIGH | `js-*`, `native-*` |\n| 6 | Animations | MEDIUM | `js-*` |\n\nImpact labels are triage hints: CRITICAL first, HIGH next, MEDIUM when evidence points there.\n\n## Quick Reference\n\n### Optimization Workflow\n\nFollow this cycle for any performance issue: **Measure → Optimize → Re-measure → Validate**\n\n1. **Measure**: Capture baseline metrics before changes. For runtime issues, prefer commit timeline, re-render counts, slow components, heaviest-commit breakdown, and startup\u002FTTI when available. Component tree depth or count are optional context, not substitutes. Do not recommend memoization, atomic state, or compiler changes without a measured render or FPS problem.\n2. **Optimize**: Apply the targeted fix from the relevant reference\n3. **Re-measure**: Run the same measurement to get updated metrics\n4. **Validate**: Confirm improvement (e.g., FPS 45→60, TTI 3.2s→1.8s, bundle 2.1MB→1.6MB)\n\nIf metrics did not improve, revert and try the next suggested fix.\n\n### Review Guardrails\n\n- Check library versions before suggesting API-specific fixes. Example: FlashList v2 deprecates `estimatedItemSize`, so do not flag it as missing there.\n- Do not suggest `useMemo` or `useCallback` dependency changes unless behavior is demonstrably incorrect or profiling shows wasted work tied to that value.\n- Do not report stale closures speculatively. Show the stale read path, a repro, or profiler evidence before calling it out.\n- When profiling a flow, measure the target interaction itself. Do not treat component tree depth or component count as the main performance evidence.\n\n### Critical: FPS & Re-renders\n\n**Profile first:**\n```bash\nagent-device react-devtools status\nagent-device react-devtools wait --connected\nagent-device react-devtools profile start\nagent-device react-devtools profile stop\nagent-device react-devtools profile slow --limit 5\nagent-device react-devtools profile rerenders --limit 5\nagent-device react-devtools profile timeline --limit 20\n```\n\nDrive the target interaction with normal `agent-device` commands between `profile start` and `profile stop`.\n\nManual fallback when `agent-device` is unavailable: open React Native DevTools from Metro (`j`) or the Dev Menu, use the Profiler tab, and record the same interaction.\n\nFor release-build React component profiling, connect [`@callstack\u002Finspector`](https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Finspector#inspector) first so React DevTools can attach to the release app, then run the `agent-device react-devtools` flow above.\n\n**Common fixes:**\n- Replace ScrollView with FlatList\u002FFlashList\u002FLegend List for long lists\n- After profiling shows cascading re-renders, use React Compiler for automatic memoization\n- After profiling shows broad store\u002Fcontext updates, use atomic state (Jotai\u002FZustand) to reduce re-renders\n- Use `useDeferredValue` for expensive computations\n\n### Critical: Bundle Size\n\n**Analyze bundle:**\n```bash\nnpx react-native bundle \\\n  --entry-file index.js \\\n  --bundle-output output.js \\\n  --platform ios \\\n  --sourcemap-output output.js.map \\\n  --dev false --minify true\n\nnpx source-map-explorer output.js --no-border-checks\n```\n\n**Verify improvement after optimization:**\n```bash\n# Record baseline size before changes\nls -lh output.js  # e.g., Before: 2.1 MB\n\n# After applying fixes, re-bundle and compare\nnpx react-native bundle --entry-file index.js --bundle-output output.js \\\n  --platform ios --dev false --minify true\nls -lh output.js  # e.g., After: 1.6 MB  (24% reduction)\n```\n\n**Common fixes:**\n- Avoid barrel imports (import directly from source)\n- Remove unnecessary Intl polyfills only after checking Hermes API and method coverage\n- Evaluate tree shaking (Expo SDK 52+ experimental unused import\u002Fexport removal, or Re.Pack only if already configured)\n- Enable R8 for Android native code shrinking\n\n### High: TTI Optimization\n\n**Measure TTI:**\n- Use `react-native-performance` for markers\n- Only measure cold starts (exclude warm\u002Fhot\u002Fprewarm)\n\n**Common fixes:**\n- For React Native 0.78 and earlier, disable Android JS bundle compression to enable Hermes mmap\n- Use native navigation (react-native-screens)\n- Preload commonly-used expensive screens before navigating to them\n\n### High: Native Performance\n\n**Profile native:**\n- iOS: Xcode Instruments → Time Profiler\n- Android: Android Studio → CPU Profiler\n\n**Common fixes:**\n- Use background threads for heavy native work\n- Prefer async over sync Turbo Module methods\n- Use C++ for cross-platform performance-critical code\n\n## References\n\nFull documentation with code examples in [references\u002F][references]:\n\n### JavaScript\u002FReact (`js-*`)\n\n| File | Impact | Description |\n|------|--------|-------------|\n| [js-lists-flatlist-flashlist.md][js-lists-flatlist-flashlist] | CRITICAL | Replace ScrollView with virtualized lists |\n| [js-profile-react.md][js-profile-react] | MEDIUM | `agent-device react-devtools` profiling |\n| [js-measure-fps.md][js-measure-fps] | HIGH | FPS monitoring and measurement |\n| [js-memory-leaks.md][js-memory-leaks] | MEDIUM | JS memory leak hunting |\n| [js-atomic-state.md][js-atomic-state] | HIGH | Jotai\u002FZustand patterns |\n| [js-concurrent-react.md][js-concurrent-react] | HIGH | useDeferredValue, useTransition |\n| [js-react-compiler.md][js-react-compiler] | HIGH | Automatic memoization |\n| [js-animations-reanimated.md][js-animations-reanimated] | MEDIUM | Reanimated worklets |\n| [js-bottomsheet.md][js-bottomsheet] | HIGH | Bottom sheet optimization |\n| [js-uncontrolled-components.md][js-uncontrolled-components] | HIGH | TextInput optimization |\n\n### Native (`native-*`)\n\n| File | Impact | Description |\n|------|--------|-------------|\n| [native-turbo-modules.md][native-turbo-modules] | HIGH | Building fast native modules |\n| [native-sdks-over-polyfills.md][native-sdks-over-polyfills] | HIGH | Native vs JS libraries |\n| [native-measure-tti.md][native-measure-tti] | HIGH | TTI measurement setup |\n| [native-threading-model.md][native-threading-model] | HIGH | Turbo Module threads |\n| [native-profiling.md][native-profiling] | MEDIUM | Xcode\u002FAndroid Studio profiling |\n| [native-platform-setup.md][native-platform-setup] | MEDIUM | iOS\u002FAndroid tooling guide |\n| [native-view-flattening.md][native-view-flattening] | MEDIUM | View hierarchy debugging |\n| [native-memory-patterns.md][native-memory-patterns] | MEDIUM | C++\u002FSwift\u002FKotlin memory |\n| [native-memory-leaks.md][native-memory-leaks] | MEDIUM | Native memory leak hunting |\n| [native-android-16kb-alignment.md][native-android-16kb-alignment] | CRITICAL | Third-party library alignment for Google Play |\n\n### Bundling (`bundle-*`)\n\n| File | Impact | Description |\n|------|--------|-------------|\n| [bundle-barrel-exports.md][bundle-barrel-exports] | CRITICAL | Avoid barrel imports |\n| [bundle-analyze-js.md][bundle-analyze-js] | CRITICAL | JS bundle visualization |\n| [bundle-tree-shaking.md][bundle-tree-shaking] | HIGH | Dead code elimination |\n| [bundle-analyze-app.md][bundle-analyze-app] | HIGH | App size analysis |\n| [bundle-r8-android.md][bundle-r8-android] | HIGH | Android code shrinking |\n| [bundle-hermes-mmap.md][bundle-hermes-mmap] | HIGH | Disable bundle compression |\n| [bundle-native-assets.md][bundle-native-assets] | HIGH | Asset catalog setup |\n| [bundle-library-size.md][bundle-library-size] | MEDIUM | Evaluate dependencies |\n| [bundle-code-splitting.md][bundle-code-splitting] | MEDIUM | Remote chunk loading safeguards |\n\n## Problem → Skill Mapping\n\n| Problem | Start With |\n|---------|------------|\n| App feels slow\u002Fjanky | [js-measure-fps.md][js-measure-fps] → [js-profile-react.md][js-profile-react] |\n| Too many re-renders | [js-profile-react.md][js-profile-react] → [js-react-compiler.md][js-react-compiler] |\n| Slow startup (TTI) | [native-measure-tti.md][native-measure-tti] → [bundle-analyze-js.md][bundle-analyze-js] |\n| Large app size | [bundle-analyze-app.md][bundle-analyze-app] → [bundle-r8-android.md][bundle-r8-android] |\n| Memory growing | [js-memory-leaks.md][js-memory-leaks] or [native-memory-leaks.md][native-memory-leaks] |\n| Animation drops frames | [js-animations-reanimated.md][js-animations-reanimated] |\n| Bottom sheet jank\u002Fre-renders | [js-bottomsheet.md][js-bottomsheet] → [js-animations-reanimated.md][js-animations-reanimated] |\n| List scroll jank | [js-lists-flatlist-flashlist.md][js-lists-flatlist-flashlist] |\n| TextInput lag | [js-uncontrolled-components.md][js-uncontrolled-components] |\n| Native module slow | [native-turbo-modules.md][native-turbo-modules] → [native-threading-model.md][native-threading-model] |\n| Native library alignment issue | [native-android-16kb-alignment.md][native-android-16kb-alignment] |\n\n[references]: references\u002F\n[js-lists-flatlist-flashlist]: references\u002Fjs-lists-flatlist-flashlist.md\n[js-profile-react]: references\u002Fjs-profile-react.md\n[js-measure-fps]: references\u002Fjs-measure-fps.md\n[js-memory-leaks]: references\u002Fjs-memory-leaks.md\n[js-atomic-state]: references\u002Fjs-atomic-state.md\n[js-concurrent-react]: references\u002Fjs-concurrent-react.md\n[js-react-compiler]: references\u002Fjs-react-compiler.md\n[js-animations-reanimated]: references\u002Fjs-animations-reanimated.md\n[js-bottomsheet]: references\u002Fjs-bottomsheet.md\n[js-uncontrolled-components]: references\u002Fjs-uncontrolled-components.md\n[native-turbo-modules]: references\u002Fnative-turbo-modules.md\n[native-sdks-over-polyfills]: references\u002Fnative-sdks-over-polyfills.md\n[native-measure-tti]: references\u002Fnative-measure-tti.md\n[native-threading-model]: references\u002Fnative-threading-model.md\n[native-profiling]: references\u002Fnative-profiling.md\n[native-platform-setup]: references\u002Fnative-platform-setup.md\n[native-view-flattening]: references\u002Fnative-view-flattening.md\n[native-memory-patterns]: references\u002Fnative-memory-patterns.md\n[native-memory-leaks]: references\u002Fnative-memory-leaks.md\n[native-android-16kb-alignment]: references\u002Fnative-android-16kb-alignment.md\n[bundle-barrel-exports]: references\u002Fbundle-barrel-exports.md\n[bundle-analyze-js]: references\u002Fbundle-analyze-js.md\n[bundle-tree-shaking]: references\u002Fbundle-tree-shaking.md\n[bundle-analyze-app]: references\u002Fbundle-analyze-app.md\n[bundle-r8-android]: references\u002Fbundle-r8-android.md\n[bundle-hermes-mmap]: references\u002Fbundle-hermes-mmap.md\n[bundle-native-assets]: references\u002Fbundle-native-assets.md\n[bundle-library-size]: references\u002Fbundle-library-size.md\n[bundle-code-splitting]: references\u002Fbundle-code-splitting.md\n\n## Attribution\n\nBased on \"The Ultimate Guide to React Native Optimization\" by Callstack.\n",{"data":35,"body":38},{"name":4,"description":6,"license":26,"metadata":36},{"author":9,"tags":37},"react-native, expo, performance, optimization, profiling",{"type":39,"children":40},"root",[41,49,56,62,68,73,113,119,137,143,352,357,363,370,381,425,430,436,483,489,497,687,715,735,763,771,802,808,816,970,978,1116,1123,1146,1152,1160,1180,1187,1205,1211,1219,1232,1239,1257,1263,1275,1288,1529,1541,1775,1787,2000,2006,2229,2235,2240],{"type":42,"tag":43,"props":44,"children":45},"element","h1",{"id":4},[46],{"type":47,"value":48},"text","React Native Best Practices",{"type":42,"tag":50,"props":51,"children":53},"h2",{"id":52},"overview",[54],{"type":47,"value":55},"Overview",{"type":42,"tag":57,"props":58,"children":59},"p",{},[60],{"type":47,"value":61},"Performance optimization guide for React Native applications, covering JavaScript\u002FReact, Native (iOS\u002FAndroid), and bundling optimizations. Based on Callstack's \"Ultimate Guide to React Native Optimization\".",{"type":42,"tag":50,"props":63,"children":65},{"id":64},"when-to-apply",[66],{"type":47,"value":67},"When to Apply",{"type":42,"tag":57,"props":69,"children":70},{},[71],{"type":47,"value":72},"Reference these guidelines when:",{"type":42,"tag":74,"props":75,"children":76},"ul",{},[77,83,88,93,98,103,108],{"type":42,"tag":78,"props":79,"children":80},"li",{},[81],{"type":47,"value":82},"Debugging slow\u002Fjanky UI or animations",{"type":42,"tag":78,"props":84,"children":85},{},[86],{"type":47,"value":87},"Investigating memory leaks (JS or native)",{"type":42,"tag":78,"props":89,"children":90},{},[91],{"type":47,"value":92},"Optimizing app startup time (TTI)",{"type":42,"tag":78,"props":94,"children":95},{},[96],{"type":47,"value":97},"Reducing bundle or app size",{"type":42,"tag":78,"props":99,"children":100},{},[101],{"type":47,"value":102},"Writing native modules (Turbo Modules)",{"type":42,"tag":78,"props":104,"children":105},{},[106],{"type":47,"value":107},"Profiling React Native performance",{"type":42,"tag":78,"props":109,"children":110},{},[111],{"type":47,"value":112},"Reviewing React Native code for performance",{"type":42,"tag":50,"props":114,"children":116},{"id":115},"security-notes",[117],{"type":47,"value":118},"Security Notes",{"type":42,"tag":74,"props":120,"children":121},{},[122,127,132],{"type":42,"tag":78,"props":123,"children":124},{},[125],{"type":47,"value":126},"Treat shell commands in these references as local developer operations. Review them before running, prefer version-pinned tooling, and avoid piping remote scripts directly to a shell.",{"type":42,"tag":78,"props":128,"children":129},{},[130],{"type":47,"value":131},"Treat third-party libraries and plugins as dependencies that still require normal supply-chain controls: pin versions, verify provenance, and update through your standard review process.",{"type":42,"tag":78,"props":133,"children":134},{},[135],{"type":47,"value":136},"Treat remote chunk loading as first-party artifact delivery only. Prefer app-bundled chunks or signed CI release manifests; hosted chunks must come from trusted HTTPS origins you control and be pinned to the current app release.",{"type":42,"tag":50,"props":138,"children":140},{"id":139},"priority-ordered-guidelines",[141],{"type":47,"value":142},"Priority-Ordered Guidelines",{"type":42,"tag":144,"props":145,"children":146},"table",{},[147,176],{"type":42,"tag":148,"props":149,"children":150},"thead",{},[151],{"type":42,"tag":152,"props":153,"children":154},"tr",{},[155,161,166,171],{"type":42,"tag":156,"props":157,"children":158},"th",{},[159],{"type":47,"value":160},"Priority",{"type":42,"tag":156,"props":162,"children":163},{},[164],{"type":47,"value":165},"Category",{"type":42,"tag":156,"props":167,"children":168},{},[169],{"type":47,"value":170},"Impact",{"type":42,"tag":156,"props":172,"children":173},{},[174],{"type":47,"value":175},"Prefix",{"type":42,"tag":177,"props":178,"children":179},"tbody",{},[180,209,235,269,294,326],{"type":42,"tag":152,"props":181,"children":182},{},[183,189,194,199],{"type":42,"tag":184,"props":185,"children":186},"td",{},[187],{"type":47,"value":188},"1",{"type":42,"tag":184,"props":190,"children":191},{},[192],{"type":47,"value":193},"FPS & Re-renders",{"type":42,"tag":184,"props":195,"children":196},{},[197],{"type":47,"value":198},"CRITICAL",{"type":42,"tag":184,"props":200,"children":201},{},[202],{"type":42,"tag":203,"props":204,"children":206},"code",{"className":205},[],[207],{"type":47,"value":208},"js-*",{"type":42,"tag":152,"props":210,"children":211},{},[212,217,222,226],{"type":42,"tag":184,"props":213,"children":214},{},[215],{"type":47,"value":216},"2",{"type":42,"tag":184,"props":218,"children":219},{},[220],{"type":47,"value":221},"Bundle Size",{"type":42,"tag":184,"props":223,"children":224},{},[225],{"type":47,"value":198},{"type":42,"tag":184,"props":227,"children":228},{},[229],{"type":42,"tag":203,"props":230,"children":232},{"className":231},[],[233],{"type":47,"value":234},"bundle-*",{"type":42,"tag":152,"props":236,"children":237},{},[238,243,248,253],{"type":42,"tag":184,"props":239,"children":240},{},[241],{"type":47,"value":242},"3",{"type":42,"tag":184,"props":244,"children":245},{},[246],{"type":47,"value":247},"TTI Optimization",{"type":42,"tag":184,"props":249,"children":250},{},[251],{"type":47,"value":252},"HIGH",{"type":42,"tag":184,"props":254,"children":255},{},[256,262,264],{"type":42,"tag":203,"props":257,"children":259},{"className":258},[],[260],{"type":47,"value":261},"native-*",{"type":47,"value":263},", ",{"type":42,"tag":203,"props":265,"children":267},{"className":266},[],[268],{"type":47,"value":234},{"type":42,"tag":152,"props":270,"children":271},{},[272,277,282,286],{"type":42,"tag":184,"props":273,"children":274},{},[275],{"type":47,"value":276},"4",{"type":42,"tag":184,"props":278,"children":279},{},[280],{"type":47,"value":281},"Native Performance",{"type":42,"tag":184,"props":283,"children":284},{},[285],{"type":47,"value":252},{"type":42,"tag":184,"props":287,"children":288},{},[289],{"type":42,"tag":203,"props":290,"children":292},{"className":291},[],[293],{"type":47,"value":261},{"type":42,"tag":152,"props":295,"children":296},{},[297,302,307,312],{"type":42,"tag":184,"props":298,"children":299},{},[300],{"type":47,"value":301},"5",{"type":42,"tag":184,"props":303,"children":304},{},[305],{"type":47,"value":306},"Memory Management",{"type":42,"tag":184,"props":308,"children":309},{},[310],{"type":47,"value":311},"MEDIUM-HIGH",{"type":42,"tag":184,"props":313,"children":314},{},[315,320,321],{"type":42,"tag":203,"props":316,"children":318},{"className":317},[],[319],{"type":47,"value":208},{"type":47,"value":263},{"type":42,"tag":203,"props":322,"children":324},{"className":323},[],[325],{"type":47,"value":261},{"type":42,"tag":152,"props":327,"children":328},{},[329,334,339,344],{"type":42,"tag":184,"props":330,"children":331},{},[332],{"type":47,"value":333},"6",{"type":42,"tag":184,"props":335,"children":336},{},[337],{"type":47,"value":338},"Animations",{"type":42,"tag":184,"props":340,"children":341},{},[342],{"type":47,"value":343},"MEDIUM",{"type":42,"tag":184,"props":345,"children":346},{},[347],{"type":42,"tag":203,"props":348,"children":350},{"className":349},[],[351],{"type":47,"value":208},{"type":42,"tag":57,"props":353,"children":354},{},[355],{"type":47,"value":356},"Impact labels are triage hints: CRITICAL first, HIGH next, MEDIUM when evidence points there.",{"type":42,"tag":50,"props":358,"children":360},{"id":359},"quick-reference",[361],{"type":47,"value":362},"Quick Reference",{"type":42,"tag":364,"props":365,"children":367},"h3",{"id":366},"optimization-workflow",[368],{"type":47,"value":369},"Optimization Workflow",{"type":42,"tag":57,"props":371,"children":372},{},[373,375],{"type":47,"value":374},"Follow this cycle for any performance issue: ",{"type":42,"tag":376,"props":377,"children":378},"strong",{},[379],{"type":47,"value":380},"Measure → Optimize → Re-measure → Validate",{"type":42,"tag":382,"props":383,"children":384},"ol",{},[385,395,405,415],{"type":42,"tag":78,"props":386,"children":387},{},[388,393],{"type":42,"tag":376,"props":389,"children":390},{},[391],{"type":47,"value":392},"Measure",{"type":47,"value":394},": Capture baseline metrics before changes. For runtime issues, prefer commit timeline, re-render counts, slow components, heaviest-commit breakdown, and startup\u002FTTI when available. Component tree depth or count are optional context, not substitutes. Do not recommend memoization, atomic state, or compiler changes without a measured render or FPS problem.",{"type":42,"tag":78,"props":396,"children":397},{},[398,403],{"type":42,"tag":376,"props":399,"children":400},{},[401],{"type":47,"value":402},"Optimize",{"type":47,"value":404},": Apply the targeted fix from the relevant reference",{"type":42,"tag":78,"props":406,"children":407},{},[408,413],{"type":42,"tag":376,"props":409,"children":410},{},[411],{"type":47,"value":412},"Re-measure",{"type":47,"value":414},": Run the same measurement to get updated metrics",{"type":42,"tag":78,"props":416,"children":417},{},[418,423],{"type":42,"tag":376,"props":419,"children":420},{},[421],{"type":47,"value":422},"Validate",{"type":47,"value":424},": Confirm improvement (e.g., FPS 45→60, TTI 3.2s→1.8s, bundle 2.1MB→1.6MB)",{"type":42,"tag":57,"props":426,"children":427},{},[428],{"type":47,"value":429},"If metrics did not improve, revert and try the next suggested fix.",{"type":42,"tag":364,"props":431,"children":433},{"id":432},"review-guardrails",[434],{"type":47,"value":435},"Review Guardrails",{"type":42,"tag":74,"props":437,"children":438},{},[439,452,473,478],{"type":42,"tag":78,"props":440,"children":441},{},[442,444,450],{"type":47,"value":443},"Check library versions before suggesting API-specific fixes. Example: FlashList v2 deprecates ",{"type":42,"tag":203,"props":445,"children":447},{"className":446},[],[448],{"type":47,"value":449},"estimatedItemSize",{"type":47,"value":451},", so do not flag it as missing there.",{"type":42,"tag":78,"props":453,"children":454},{},[455,457,463,465,471],{"type":47,"value":456},"Do not suggest ",{"type":42,"tag":203,"props":458,"children":460},{"className":459},[],[461],{"type":47,"value":462},"useMemo",{"type":47,"value":464}," or ",{"type":42,"tag":203,"props":466,"children":468},{"className":467},[],[469],{"type":47,"value":470},"useCallback",{"type":47,"value":472}," dependency changes unless behavior is demonstrably incorrect or profiling shows wasted work tied to that value.",{"type":42,"tag":78,"props":474,"children":475},{},[476],{"type":47,"value":477},"Do not report stale closures speculatively. Show the stale read path, a repro, or profiler evidence before calling it out.",{"type":42,"tag":78,"props":479,"children":480},{},[481],{"type":47,"value":482},"When profiling a flow, measure the target interaction itself. Do not treat component tree depth or component count as the main performance evidence.",{"type":42,"tag":364,"props":484,"children":486},{"id":485},"critical-fps-re-renders",[487],{"type":47,"value":488},"Critical: FPS & Re-renders",{"type":42,"tag":57,"props":490,"children":491},{},[492],{"type":42,"tag":376,"props":493,"children":494},{},[495],{"type":47,"value":496},"Profile first:",{"type":42,"tag":498,"props":499,"children":504},"pre",{"className":500,"code":501,"language":502,"meta":503,"style":503},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","agent-device react-devtools status\nagent-device react-devtools wait --connected\nagent-device react-devtools profile start\nagent-device react-devtools profile stop\nagent-device react-devtools profile slow --limit 5\nagent-device react-devtools profile rerenders --limit 5\nagent-device react-devtools profile timeline --limit 20\n","bash","",[505],{"type":42,"tag":203,"props":506,"children":507},{"__ignoreMap":503},[508,531,553,575,596,628,657],{"type":42,"tag":509,"props":510,"children":513},"span",{"class":511,"line":512},"line",1,[514,520,526],{"type":42,"tag":509,"props":515,"children":517},{"style":516},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[518],{"type":47,"value":519},"agent-device",{"type":42,"tag":509,"props":521,"children":523},{"style":522},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[524],{"type":47,"value":525}," react-devtools",{"type":42,"tag":509,"props":527,"children":528},{"style":522},[529],{"type":47,"value":530}," status\n",{"type":42,"tag":509,"props":532,"children":534},{"class":511,"line":533},2,[535,539,543,548],{"type":42,"tag":509,"props":536,"children":537},{"style":516},[538],{"type":47,"value":519},{"type":42,"tag":509,"props":540,"children":541},{"style":522},[542],{"type":47,"value":525},{"type":42,"tag":509,"props":544,"children":545},{"style":522},[546],{"type":47,"value":547}," wait",{"type":42,"tag":509,"props":549,"children":550},{"style":522},[551],{"type":47,"value":552}," --connected\n",{"type":42,"tag":509,"props":554,"children":556},{"class":511,"line":555},3,[557,561,565,570],{"type":42,"tag":509,"props":558,"children":559},{"style":516},[560],{"type":47,"value":519},{"type":42,"tag":509,"props":562,"children":563},{"style":522},[564],{"type":47,"value":525},{"type":42,"tag":509,"props":566,"children":567},{"style":522},[568],{"type":47,"value":569}," profile",{"type":42,"tag":509,"props":571,"children":572},{"style":522},[573],{"type":47,"value":574}," start\n",{"type":42,"tag":509,"props":576,"children":578},{"class":511,"line":577},4,[579,583,587,591],{"type":42,"tag":509,"props":580,"children":581},{"style":516},[582],{"type":47,"value":519},{"type":42,"tag":509,"props":584,"children":585},{"style":522},[586],{"type":47,"value":525},{"type":42,"tag":509,"props":588,"children":589},{"style":522},[590],{"type":47,"value":569},{"type":42,"tag":509,"props":592,"children":593},{"style":522},[594],{"type":47,"value":595}," stop\n",{"type":42,"tag":509,"props":597,"children":599},{"class":511,"line":598},5,[600,604,608,612,617,622],{"type":42,"tag":509,"props":601,"children":602},{"style":516},[603],{"type":47,"value":519},{"type":42,"tag":509,"props":605,"children":606},{"style":522},[607],{"type":47,"value":525},{"type":42,"tag":509,"props":609,"children":610},{"style":522},[611],{"type":47,"value":569},{"type":42,"tag":509,"props":613,"children":614},{"style":522},[615],{"type":47,"value":616}," slow",{"type":42,"tag":509,"props":618,"children":619},{"style":522},[620],{"type":47,"value":621}," --limit",{"type":42,"tag":509,"props":623,"children":625},{"style":624},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[626],{"type":47,"value":627}," 5\n",{"type":42,"tag":509,"props":629,"children":631},{"class":511,"line":630},6,[632,636,640,644,649,653],{"type":42,"tag":509,"props":633,"children":634},{"style":516},[635],{"type":47,"value":519},{"type":42,"tag":509,"props":637,"children":638},{"style":522},[639],{"type":47,"value":525},{"type":42,"tag":509,"props":641,"children":642},{"style":522},[643],{"type":47,"value":569},{"type":42,"tag":509,"props":645,"children":646},{"style":522},[647],{"type":47,"value":648}," rerenders",{"type":42,"tag":509,"props":650,"children":651},{"style":522},[652],{"type":47,"value":621},{"type":42,"tag":509,"props":654,"children":655},{"style":624},[656],{"type":47,"value":627},{"type":42,"tag":509,"props":658,"children":660},{"class":511,"line":659},7,[661,665,669,673,678,682],{"type":42,"tag":509,"props":662,"children":663},{"style":516},[664],{"type":47,"value":519},{"type":42,"tag":509,"props":666,"children":667},{"style":522},[668],{"type":47,"value":525},{"type":42,"tag":509,"props":670,"children":671},{"style":522},[672],{"type":47,"value":569},{"type":42,"tag":509,"props":674,"children":675},{"style":522},[676],{"type":47,"value":677}," timeline",{"type":42,"tag":509,"props":679,"children":680},{"style":522},[681],{"type":47,"value":621},{"type":42,"tag":509,"props":683,"children":684},{"style":624},[685],{"type":47,"value":686}," 20\n",{"type":42,"tag":57,"props":688,"children":689},{},[690,692,697,699,705,707,713],{"type":47,"value":691},"Drive the target interaction with normal ",{"type":42,"tag":203,"props":693,"children":695},{"className":694},[],[696],{"type":47,"value":519},{"type":47,"value":698}," commands between ",{"type":42,"tag":203,"props":700,"children":702},{"className":701},[],[703],{"type":47,"value":704},"profile start",{"type":47,"value":706}," and ",{"type":42,"tag":203,"props":708,"children":710},{"className":709},[],[711],{"type":47,"value":712},"profile stop",{"type":47,"value":714},".",{"type":42,"tag":57,"props":716,"children":717},{},[718,720,725,727,733],{"type":47,"value":719},"Manual fallback when ",{"type":42,"tag":203,"props":721,"children":723},{"className":722},[],[724],{"type":47,"value":519},{"type":47,"value":726}," is unavailable: open React Native DevTools from Metro (",{"type":42,"tag":203,"props":728,"children":730},{"className":729},[],[731],{"type":47,"value":732},"j",{"type":47,"value":734},") or the Dev Menu, use the Profiler tab, and record the same interaction.",{"type":42,"tag":57,"props":736,"children":737},{},[738,740,753,755,761],{"type":47,"value":739},"For release-build React component profiling, connect ",{"type":42,"tag":741,"props":742,"children":746},"a",{"href":743,"rel":744},"https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Finspector#inspector",[745],"nofollow",[747],{"type":42,"tag":203,"props":748,"children":750},{"className":749},[],[751],{"type":47,"value":752},"@callstack\u002Finspector",{"type":47,"value":754}," first so React DevTools can attach to the release app, then run the ",{"type":42,"tag":203,"props":756,"children":758},{"className":757},[],[759],{"type":47,"value":760},"agent-device react-devtools",{"type":47,"value":762}," flow above.",{"type":42,"tag":57,"props":764,"children":765},{},[766],{"type":42,"tag":376,"props":767,"children":768},{},[769],{"type":47,"value":770},"Common fixes:",{"type":42,"tag":74,"props":772,"children":773},{},[774,779,784,789],{"type":42,"tag":78,"props":775,"children":776},{},[777],{"type":47,"value":778},"Replace ScrollView with FlatList\u002FFlashList\u002FLegend List for long lists",{"type":42,"tag":78,"props":780,"children":781},{},[782],{"type":47,"value":783},"After profiling shows cascading re-renders, use React Compiler for automatic memoization",{"type":42,"tag":78,"props":785,"children":786},{},[787],{"type":47,"value":788},"After profiling shows broad store\u002Fcontext updates, use atomic state (Jotai\u002FZustand) to reduce re-renders",{"type":42,"tag":78,"props":790,"children":791},{},[792,794,800],{"type":47,"value":793},"Use ",{"type":42,"tag":203,"props":795,"children":797},{"className":796},[],[798],{"type":47,"value":799},"useDeferredValue",{"type":47,"value":801}," for expensive computations",{"type":42,"tag":364,"props":803,"children":805},{"id":804},"critical-bundle-size",[806],{"type":47,"value":807},"Critical: Bundle Size",{"type":42,"tag":57,"props":809,"children":810},{},[811],{"type":42,"tag":376,"props":812,"children":813},{},[814],{"type":47,"value":815},"Analyze bundle:",{"type":42,"tag":498,"props":817,"children":819},{"className":500,"code":818,"language":502,"meta":503,"style":503},"npx react-native bundle \\\n  --entry-file index.js \\\n  --bundle-output output.js \\\n  --platform ios \\\n  --sourcemap-output output.js.map \\\n  --dev false --minify true\n\nnpx source-map-explorer output.js --no-border-checks\n",[820],{"type":42,"tag":203,"props":821,"children":822},{"__ignoreMap":503},[823,847,864,881,898,915,939,948],{"type":42,"tag":509,"props":824,"children":825},{"class":511,"line":512},[826,831,836,841],{"type":42,"tag":509,"props":827,"children":828},{"style":516},[829],{"type":47,"value":830},"npx",{"type":42,"tag":509,"props":832,"children":833},{"style":522},[834],{"type":47,"value":835}," react-native",{"type":42,"tag":509,"props":837,"children":838},{"style":522},[839],{"type":47,"value":840}," bundle",{"type":42,"tag":509,"props":842,"children":844},{"style":843},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[845],{"type":47,"value":846}," \\\n",{"type":42,"tag":509,"props":848,"children":849},{"class":511,"line":533},[850,855,860],{"type":42,"tag":509,"props":851,"children":852},{"style":522},[853],{"type":47,"value":854},"  --entry-file",{"type":42,"tag":509,"props":856,"children":857},{"style":522},[858],{"type":47,"value":859}," index.js",{"type":42,"tag":509,"props":861,"children":862},{"style":843},[863],{"type":47,"value":846},{"type":42,"tag":509,"props":865,"children":866},{"class":511,"line":555},[867,872,877],{"type":42,"tag":509,"props":868,"children":869},{"style":522},[870],{"type":47,"value":871},"  --bundle-output",{"type":42,"tag":509,"props":873,"children":874},{"style":522},[875],{"type":47,"value":876}," output.js",{"type":42,"tag":509,"props":878,"children":879},{"style":843},[880],{"type":47,"value":846},{"type":42,"tag":509,"props":882,"children":883},{"class":511,"line":577},[884,889,894],{"type":42,"tag":509,"props":885,"children":886},{"style":522},[887],{"type":47,"value":888},"  --platform",{"type":42,"tag":509,"props":890,"children":891},{"style":522},[892],{"type":47,"value":893}," ios",{"type":42,"tag":509,"props":895,"children":896},{"style":843},[897],{"type":47,"value":846},{"type":42,"tag":509,"props":899,"children":900},{"class":511,"line":598},[901,906,911],{"type":42,"tag":509,"props":902,"children":903},{"style":522},[904],{"type":47,"value":905},"  --sourcemap-output",{"type":42,"tag":509,"props":907,"children":908},{"style":522},[909],{"type":47,"value":910}," output.js.map",{"type":42,"tag":509,"props":912,"children":913},{"style":843},[914],{"type":47,"value":846},{"type":42,"tag":509,"props":916,"children":917},{"class":511,"line":630},[918,923,929,934],{"type":42,"tag":509,"props":919,"children":920},{"style":522},[921],{"type":47,"value":922},"  --dev",{"type":42,"tag":509,"props":924,"children":926},{"style":925},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[927],{"type":47,"value":928}," false",{"type":42,"tag":509,"props":930,"children":931},{"style":522},[932],{"type":47,"value":933}," --minify",{"type":42,"tag":509,"props":935,"children":936},{"style":925},[937],{"type":47,"value":938}," true\n",{"type":42,"tag":509,"props":940,"children":941},{"class":511,"line":659},[942],{"type":42,"tag":509,"props":943,"children":945},{"emptyLinePlaceholder":944},true,[946],{"type":47,"value":947},"\n",{"type":42,"tag":509,"props":949,"children":951},{"class":511,"line":950},8,[952,956,961,965],{"type":42,"tag":509,"props":953,"children":954},{"style":516},[955],{"type":47,"value":830},{"type":42,"tag":509,"props":957,"children":958},{"style":522},[959],{"type":47,"value":960}," source-map-explorer",{"type":42,"tag":509,"props":962,"children":963},{"style":522},[964],{"type":47,"value":876},{"type":42,"tag":509,"props":966,"children":967},{"style":522},[968],{"type":47,"value":969}," --no-border-checks\n",{"type":42,"tag":57,"props":971,"children":972},{},[973],{"type":42,"tag":376,"props":974,"children":975},{},[976],{"type":47,"value":977},"Verify improvement after optimization:",{"type":42,"tag":498,"props":979,"children":981},{"className":500,"code":980,"language":502,"meta":503,"style":503},"# Record baseline size before changes\nls -lh output.js  # e.g., Before: 2.1 MB\n\n# After applying fixes, re-bundle and compare\nnpx react-native bundle --entry-file index.js --bundle-output output.js \\\n  --platform ios --dev false --minify true\nls -lh output.js  # e.g., After: 1.6 MB  (24% reduction)\n",[982],{"type":42,"tag":203,"props":983,"children":984},{"__ignoreMap":503},[985,994,1016,1023,1031,1068,1096],{"type":42,"tag":509,"props":986,"children":987},{"class":511,"line":512},[988],{"type":42,"tag":509,"props":989,"children":991},{"style":990},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[992],{"type":47,"value":993},"# Record baseline size before changes\n",{"type":42,"tag":509,"props":995,"children":996},{"class":511,"line":533},[997,1002,1007,1011],{"type":42,"tag":509,"props":998,"children":999},{"style":516},[1000],{"type":47,"value":1001},"ls",{"type":42,"tag":509,"props":1003,"children":1004},{"style":522},[1005],{"type":47,"value":1006}," -lh",{"type":42,"tag":509,"props":1008,"children":1009},{"style":522},[1010],{"type":47,"value":876},{"type":42,"tag":509,"props":1012,"children":1013},{"style":990},[1014],{"type":47,"value":1015},"  # e.g., Before: 2.1 MB\n",{"type":42,"tag":509,"props":1017,"children":1018},{"class":511,"line":555},[1019],{"type":42,"tag":509,"props":1020,"children":1021},{"emptyLinePlaceholder":944},[1022],{"type":47,"value":947},{"type":42,"tag":509,"props":1024,"children":1025},{"class":511,"line":577},[1026],{"type":42,"tag":509,"props":1027,"children":1028},{"style":990},[1029],{"type":47,"value":1030},"# After applying fixes, re-bundle and compare\n",{"type":42,"tag":509,"props":1032,"children":1033},{"class":511,"line":598},[1034,1038,1042,1046,1051,1055,1060,1064],{"type":42,"tag":509,"props":1035,"children":1036},{"style":516},[1037],{"type":47,"value":830},{"type":42,"tag":509,"props":1039,"children":1040},{"style":522},[1041],{"type":47,"value":835},{"type":42,"tag":509,"props":1043,"children":1044},{"style":522},[1045],{"type":47,"value":840},{"type":42,"tag":509,"props":1047,"children":1048},{"style":522},[1049],{"type":47,"value":1050}," --entry-file",{"type":42,"tag":509,"props":1052,"children":1053},{"style":522},[1054],{"type":47,"value":859},{"type":42,"tag":509,"props":1056,"children":1057},{"style":522},[1058],{"type":47,"value":1059}," --bundle-output",{"type":42,"tag":509,"props":1061,"children":1062},{"style":522},[1063],{"type":47,"value":876},{"type":42,"tag":509,"props":1065,"children":1066},{"style":843},[1067],{"type":47,"value":846},{"type":42,"tag":509,"props":1069,"children":1070},{"class":511,"line":630},[1071,1075,1079,1084,1088,1092],{"type":42,"tag":509,"props":1072,"children":1073},{"style":522},[1074],{"type":47,"value":888},{"type":42,"tag":509,"props":1076,"children":1077},{"style":522},[1078],{"type":47,"value":893},{"type":42,"tag":509,"props":1080,"children":1081},{"style":522},[1082],{"type":47,"value":1083}," --dev",{"type":42,"tag":509,"props":1085,"children":1086},{"style":925},[1087],{"type":47,"value":928},{"type":42,"tag":509,"props":1089,"children":1090},{"style":522},[1091],{"type":47,"value":933},{"type":42,"tag":509,"props":1093,"children":1094},{"style":925},[1095],{"type":47,"value":938},{"type":42,"tag":509,"props":1097,"children":1098},{"class":511,"line":659},[1099,1103,1107,1111],{"type":42,"tag":509,"props":1100,"children":1101},{"style":516},[1102],{"type":47,"value":1001},{"type":42,"tag":509,"props":1104,"children":1105},{"style":522},[1106],{"type":47,"value":1006},{"type":42,"tag":509,"props":1108,"children":1109},{"style":522},[1110],{"type":47,"value":876},{"type":42,"tag":509,"props":1112,"children":1113},{"style":990},[1114],{"type":47,"value":1115},"  # e.g., After: 1.6 MB  (24% reduction)\n",{"type":42,"tag":57,"props":1117,"children":1118},{},[1119],{"type":42,"tag":376,"props":1120,"children":1121},{},[1122],{"type":47,"value":770},{"type":42,"tag":74,"props":1124,"children":1125},{},[1126,1131,1136,1141],{"type":42,"tag":78,"props":1127,"children":1128},{},[1129],{"type":47,"value":1130},"Avoid barrel imports (import directly from source)",{"type":42,"tag":78,"props":1132,"children":1133},{},[1134],{"type":47,"value":1135},"Remove unnecessary Intl polyfills only after checking Hermes API and method coverage",{"type":42,"tag":78,"props":1137,"children":1138},{},[1139],{"type":47,"value":1140},"Evaluate tree shaking (Expo SDK 52+ experimental unused import\u002Fexport removal, or Re.Pack only if already configured)",{"type":42,"tag":78,"props":1142,"children":1143},{},[1144],{"type":47,"value":1145},"Enable R8 for Android native code shrinking",{"type":42,"tag":364,"props":1147,"children":1149},{"id":1148},"high-tti-optimization",[1150],{"type":47,"value":1151},"High: TTI Optimization",{"type":42,"tag":57,"props":1153,"children":1154},{},[1155],{"type":42,"tag":376,"props":1156,"children":1157},{},[1158],{"type":47,"value":1159},"Measure TTI:",{"type":42,"tag":74,"props":1161,"children":1162},{},[1163,1175],{"type":42,"tag":78,"props":1164,"children":1165},{},[1166,1167,1173],{"type":47,"value":793},{"type":42,"tag":203,"props":1168,"children":1170},{"className":1169},[],[1171],{"type":47,"value":1172},"react-native-performance",{"type":47,"value":1174}," for markers",{"type":42,"tag":78,"props":1176,"children":1177},{},[1178],{"type":47,"value":1179},"Only measure cold starts (exclude warm\u002Fhot\u002Fprewarm)",{"type":42,"tag":57,"props":1181,"children":1182},{},[1183],{"type":42,"tag":376,"props":1184,"children":1185},{},[1186],{"type":47,"value":770},{"type":42,"tag":74,"props":1188,"children":1189},{},[1190,1195,1200],{"type":42,"tag":78,"props":1191,"children":1192},{},[1193],{"type":47,"value":1194},"For React Native 0.78 and earlier, disable Android JS bundle compression to enable Hermes mmap",{"type":42,"tag":78,"props":1196,"children":1197},{},[1198],{"type":47,"value":1199},"Use native navigation (react-native-screens)",{"type":42,"tag":78,"props":1201,"children":1202},{},[1203],{"type":47,"value":1204},"Preload commonly-used expensive screens before navigating to them",{"type":42,"tag":364,"props":1206,"children":1208},{"id":1207},"high-native-performance",[1209],{"type":47,"value":1210},"High: Native Performance",{"type":42,"tag":57,"props":1212,"children":1213},{},[1214],{"type":42,"tag":376,"props":1215,"children":1216},{},[1217],{"type":47,"value":1218},"Profile native:",{"type":42,"tag":74,"props":1220,"children":1221},{},[1222,1227],{"type":42,"tag":78,"props":1223,"children":1224},{},[1225],{"type":47,"value":1226},"iOS: Xcode Instruments → Time Profiler",{"type":42,"tag":78,"props":1228,"children":1229},{},[1230],{"type":47,"value":1231},"Android: Android Studio → CPU Profiler",{"type":42,"tag":57,"props":1233,"children":1234},{},[1235],{"type":42,"tag":376,"props":1236,"children":1237},{},[1238],{"type":47,"value":770},{"type":42,"tag":74,"props":1240,"children":1241},{},[1242,1247,1252],{"type":42,"tag":78,"props":1243,"children":1244},{},[1245],{"type":47,"value":1246},"Use background threads for heavy native work",{"type":42,"tag":78,"props":1248,"children":1249},{},[1250],{"type":47,"value":1251},"Prefer async over sync Turbo Module methods",{"type":42,"tag":78,"props":1253,"children":1254},{},[1255],{"type":47,"value":1256},"Use C++ for cross-platform performance-critical code",{"type":42,"tag":50,"props":1258,"children":1260},{"id":1259},"references",[1261],{"type":47,"value":1262},"References",{"type":42,"tag":57,"props":1264,"children":1265},{},[1266,1268,1273],{"type":47,"value":1267},"Full documentation with code examples in ",{"type":42,"tag":741,"props":1269,"children":1271},{"href":1270},"references\u002F",[1272],{"type":47,"value":1270},{"type":47,"value":1274},":",{"type":42,"tag":364,"props":1276,"children":1278},{"id":1277},"javascriptreact-js",[1279,1281,1286],{"type":47,"value":1280},"JavaScript\u002FReact (",{"type":42,"tag":203,"props":1282,"children":1284},{"className":1283},[],[1285],{"type":47,"value":208},{"type":47,"value":1287},")",{"type":42,"tag":144,"props":1289,"children":1290},{},[1291,1311],{"type":42,"tag":148,"props":1292,"children":1293},{},[1294],{"type":42,"tag":152,"props":1295,"children":1296},{},[1297,1302,1306],{"type":42,"tag":156,"props":1298,"children":1299},{},[1300],{"type":47,"value":1301},"File",{"type":42,"tag":156,"props":1303,"children":1304},{},[1305],{"type":47,"value":170},{"type":42,"tag":156,"props":1307,"children":1308},{},[1309],{"type":47,"value":1310},"Description",{"type":42,"tag":177,"props":1312,"children":1313},{},[1314,1335,1361,1382,1403,1424,1445,1466,1487,1508],{"type":42,"tag":152,"props":1315,"children":1316},{},[1317,1326,1330],{"type":42,"tag":184,"props":1318,"children":1319},{},[1320],{"type":42,"tag":741,"props":1321,"children":1323},{"href":1322},"references\u002Fjs-lists-flatlist-flashlist.md",[1324],{"type":47,"value":1325},"js-lists-flatlist-flashlist.md",{"type":42,"tag":184,"props":1327,"children":1328},{},[1329],{"type":47,"value":198},{"type":42,"tag":184,"props":1331,"children":1332},{},[1333],{"type":47,"value":1334},"Replace ScrollView with virtualized lists",{"type":42,"tag":152,"props":1336,"children":1337},{},[1338,1347,1351],{"type":42,"tag":184,"props":1339,"children":1340},{},[1341],{"type":42,"tag":741,"props":1342,"children":1344},{"href":1343},"references\u002Fjs-profile-react.md",[1345],{"type":47,"value":1346},"js-profile-react.md",{"type":42,"tag":184,"props":1348,"children":1349},{},[1350],{"type":47,"value":343},{"type":42,"tag":184,"props":1352,"children":1353},{},[1354,1359],{"type":42,"tag":203,"props":1355,"children":1357},{"className":1356},[],[1358],{"type":47,"value":760},{"type":47,"value":1360}," profiling",{"type":42,"tag":152,"props":1362,"children":1363},{},[1364,1373,1377],{"type":42,"tag":184,"props":1365,"children":1366},{},[1367],{"type":42,"tag":741,"props":1368,"children":1370},{"href":1369},"references\u002Fjs-measure-fps.md",[1371],{"type":47,"value":1372},"js-measure-fps.md",{"type":42,"tag":184,"props":1374,"children":1375},{},[1376],{"type":47,"value":252},{"type":42,"tag":184,"props":1378,"children":1379},{},[1380],{"type":47,"value":1381},"FPS monitoring and measurement",{"type":42,"tag":152,"props":1383,"children":1384},{},[1385,1394,1398],{"type":42,"tag":184,"props":1386,"children":1387},{},[1388],{"type":42,"tag":741,"props":1389,"children":1391},{"href":1390},"references\u002Fjs-memory-leaks.md",[1392],{"type":47,"value":1393},"js-memory-leaks.md",{"type":42,"tag":184,"props":1395,"children":1396},{},[1397],{"type":47,"value":343},{"type":42,"tag":184,"props":1399,"children":1400},{},[1401],{"type":47,"value":1402},"JS memory leak hunting",{"type":42,"tag":152,"props":1404,"children":1405},{},[1406,1415,1419],{"type":42,"tag":184,"props":1407,"children":1408},{},[1409],{"type":42,"tag":741,"props":1410,"children":1412},{"href":1411},"references\u002Fjs-atomic-state.md",[1413],{"type":47,"value":1414},"js-atomic-state.md",{"type":42,"tag":184,"props":1416,"children":1417},{},[1418],{"type":47,"value":252},{"type":42,"tag":184,"props":1420,"children":1421},{},[1422],{"type":47,"value":1423},"Jotai\u002FZustand patterns",{"type":42,"tag":152,"props":1425,"children":1426},{},[1427,1436,1440],{"type":42,"tag":184,"props":1428,"children":1429},{},[1430],{"type":42,"tag":741,"props":1431,"children":1433},{"href":1432},"references\u002Fjs-concurrent-react.md",[1434],{"type":47,"value":1435},"js-concurrent-react.md",{"type":42,"tag":184,"props":1437,"children":1438},{},[1439],{"type":47,"value":252},{"type":42,"tag":184,"props":1441,"children":1442},{},[1443],{"type":47,"value":1444},"useDeferredValue, useTransition",{"type":42,"tag":152,"props":1446,"children":1447},{},[1448,1457,1461],{"type":42,"tag":184,"props":1449,"children":1450},{},[1451],{"type":42,"tag":741,"props":1452,"children":1454},{"href":1453},"references\u002Fjs-react-compiler.md",[1455],{"type":47,"value":1456},"js-react-compiler.md",{"type":42,"tag":184,"props":1458,"children":1459},{},[1460],{"type":47,"value":252},{"type":42,"tag":184,"props":1462,"children":1463},{},[1464],{"type":47,"value":1465},"Automatic memoization",{"type":42,"tag":152,"props":1467,"children":1468},{},[1469,1478,1482],{"type":42,"tag":184,"props":1470,"children":1471},{},[1472],{"type":42,"tag":741,"props":1473,"children":1475},{"href":1474},"references\u002Fjs-animations-reanimated.md",[1476],{"type":47,"value":1477},"js-animations-reanimated.md",{"type":42,"tag":184,"props":1479,"children":1480},{},[1481],{"type":47,"value":343},{"type":42,"tag":184,"props":1483,"children":1484},{},[1485],{"type":47,"value":1486},"Reanimated worklets",{"type":42,"tag":152,"props":1488,"children":1489},{},[1490,1499,1503],{"type":42,"tag":184,"props":1491,"children":1492},{},[1493],{"type":42,"tag":741,"props":1494,"children":1496},{"href":1495},"references\u002Fjs-bottomsheet.md",[1497],{"type":47,"value":1498},"js-bottomsheet.md",{"type":42,"tag":184,"props":1500,"children":1501},{},[1502],{"type":47,"value":252},{"type":42,"tag":184,"props":1504,"children":1505},{},[1506],{"type":47,"value":1507},"Bottom sheet optimization",{"type":42,"tag":152,"props":1509,"children":1510},{},[1511,1520,1524],{"type":42,"tag":184,"props":1512,"children":1513},{},[1514],{"type":42,"tag":741,"props":1515,"children":1517},{"href":1516},"references\u002Fjs-uncontrolled-components.md",[1518],{"type":47,"value":1519},"js-uncontrolled-components.md",{"type":42,"tag":184,"props":1521,"children":1522},{},[1523],{"type":47,"value":252},{"type":42,"tag":184,"props":1525,"children":1526},{},[1527],{"type":47,"value":1528},"TextInput optimization",{"type":42,"tag":364,"props":1530,"children":1532},{"id":1531},"native-native",[1533,1535,1540],{"type":47,"value":1534},"Native (",{"type":42,"tag":203,"props":1536,"children":1538},{"className":1537},[],[1539],{"type":47,"value":261},{"type":47,"value":1287},{"type":42,"tag":144,"props":1542,"children":1543},{},[1544,1562],{"type":42,"tag":148,"props":1545,"children":1546},{},[1547],{"type":42,"tag":152,"props":1548,"children":1549},{},[1550,1554,1558],{"type":42,"tag":156,"props":1551,"children":1552},{},[1553],{"type":47,"value":1301},{"type":42,"tag":156,"props":1555,"children":1556},{},[1557],{"type":47,"value":170},{"type":42,"tag":156,"props":1559,"children":1560},{},[1561],{"type":47,"value":1310},{"type":42,"tag":177,"props":1563,"children":1564},{},[1565,1586,1607,1628,1649,1670,1691,1712,1733,1754],{"type":42,"tag":152,"props":1566,"children":1567},{},[1568,1577,1581],{"type":42,"tag":184,"props":1569,"children":1570},{},[1571],{"type":42,"tag":741,"props":1572,"children":1574},{"href":1573},"references\u002Fnative-turbo-modules.md",[1575],{"type":47,"value":1576},"native-turbo-modules.md",{"type":42,"tag":184,"props":1578,"children":1579},{},[1580],{"type":47,"value":252},{"type":42,"tag":184,"props":1582,"children":1583},{},[1584],{"type":47,"value":1585},"Building fast native modules",{"type":42,"tag":152,"props":1587,"children":1588},{},[1589,1598,1602],{"type":42,"tag":184,"props":1590,"children":1591},{},[1592],{"type":42,"tag":741,"props":1593,"children":1595},{"href":1594},"references\u002Fnative-sdks-over-polyfills.md",[1596],{"type":47,"value":1597},"native-sdks-over-polyfills.md",{"type":42,"tag":184,"props":1599,"children":1600},{},[1601],{"type":47,"value":252},{"type":42,"tag":184,"props":1603,"children":1604},{},[1605],{"type":47,"value":1606},"Native vs JS libraries",{"type":42,"tag":152,"props":1608,"children":1609},{},[1610,1619,1623],{"type":42,"tag":184,"props":1611,"children":1612},{},[1613],{"type":42,"tag":741,"props":1614,"children":1616},{"href":1615},"references\u002Fnative-measure-tti.md",[1617],{"type":47,"value":1618},"native-measure-tti.md",{"type":42,"tag":184,"props":1620,"children":1621},{},[1622],{"type":47,"value":252},{"type":42,"tag":184,"props":1624,"children":1625},{},[1626],{"type":47,"value":1627},"TTI measurement setup",{"type":42,"tag":152,"props":1629,"children":1630},{},[1631,1640,1644],{"type":42,"tag":184,"props":1632,"children":1633},{},[1634],{"type":42,"tag":741,"props":1635,"children":1637},{"href":1636},"references\u002Fnative-threading-model.md",[1638],{"type":47,"value":1639},"native-threading-model.md",{"type":42,"tag":184,"props":1641,"children":1642},{},[1643],{"type":47,"value":252},{"type":42,"tag":184,"props":1645,"children":1646},{},[1647],{"type":47,"value":1648},"Turbo Module threads",{"type":42,"tag":152,"props":1650,"children":1651},{},[1652,1661,1665],{"type":42,"tag":184,"props":1653,"children":1654},{},[1655],{"type":42,"tag":741,"props":1656,"children":1658},{"href":1657},"references\u002Fnative-profiling.md",[1659],{"type":47,"value":1660},"native-profiling.md",{"type":42,"tag":184,"props":1662,"children":1663},{},[1664],{"type":47,"value":343},{"type":42,"tag":184,"props":1666,"children":1667},{},[1668],{"type":47,"value":1669},"Xcode\u002FAndroid Studio profiling",{"type":42,"tag":152,"props":1671,"children":1672},{},[1673,1682,1686],{"type":42,"tag":184,"props":1674,"children":1675},{},[1676],{"type":42,"tag":741,"props":1677,"children":1679},{"href":1678},"references\u002Fnative-platform-setup.md",[1680],{"type":47,"value":1681},"native-platform-setup.md",{"type":42,"tag":184,"props":1683,"children":1684},{},[1685],{"type":47,"value":343},{"type":42,"tag":184,"props":1687,"children":1688},{},[1689],{"type":47,"value":1690},"iOS\u002FAndroid tooling guide",{"type":42,"tag":152,"props":1692,"children":1693},{},[1694,1703,1707],{"type":42,"tag":184,"props":1695,"children":1696},{},[1697],{"type":42,"tag":741,"props":1698,"children":1700},{"href":1699},"references\u002Fnative-view-flattening.md",[1701],{"type":47,"value":1702},"native-view-flattening.md",{"type":42,"tag":184,"props":1704,"children":1705},{},[1706],{"type":47,"value":343},{"type":42,"tag":184,"props":1708,"children":1709},{},[1710],{"type":47,"value":1711},"View hierarchy debugging",{"type":42,"tag":152,"props":1713,"children":1714},{},[1715,1724,1728],{"type":42,"tag":184,"props":1716,"children":1717},{},[1718],{"type":42,"tag":741,"props":1719,"children":1721},{"href":1720},"references\u002Fnative-memory-patterns.md",[1722],{"type":47,"value":1723},"native-memory-patterns.md",{"type":42,"tag":184,"props":1725,"children":1726},{},[1727],{"type":47,"value":343},{"type":42,"tag":184,"props":1729,"children":1730},{},[1731],{"type":47,"value":1732},"C++\u002FSwift\u002FKotlin memory",{"type":42,"tag":152,"props":1734,"children":1735},{},[1736,1745,1749],{"type":42,"tag":184,"props":1737,"children":1738},{},[1739],{"type":42,"tag":741,"props":1740,"children":1742},{"href":1741},"references\u002Fnative-memory-leaks.md",[1743],{"type":47,"value":1744},"native-memory-leaks.md",{"type":42,"tag":184,"props":1746,"children":1747},{},[1748],{"type":47,"value":343},{"type":42,"tag":184,"props":1750,"children":1751},{},[1752],{"type":47,"value":1753},"Native memory leak hunting",{"type":42,"tag":152,"props":1755,"children":1756},{},[1757,1766,1770],{"type":42,"tag":184,"props":1758,"children":1759},{},[1760],{"type":42,"tag":741,"props":1761,"children":1763},{"href":1762},"references\u002Fnative-android-16kb-alignment.md",[1764],{"type":47,"value":1765},"native-android-16kb-alignment.md",{"type":42,"tag":184,"props":1767,"children":1768},{},[1769],{"type":47,"value":198},{"type":42,"tag":184,"props":1771,"children":1772},{},[1773],{"type":47,"value":1774},"Third-party library alignment for Google Play",{"type":42,"tag":364,"props":1776,"children":1778},{"id":1777},"bundling-bundle",[1779,1781,1786],{"type":47,"value":1780},"Bundling (",{"type":42,"tag":203,"props":1782,"children":1784},{"className":1783},[],[1785],{"type":47,"value":234},{"type":47,"value":1287},{"type":42,"tag":144,"props":1788,"children":1789},{},[1790,1808],{"type":42,"tag":148,"props":1791,"children":1792},{},[1793],{"type":42,"tag":152,"props":1794,"children":1795},{},[1796,1800,1804],{"type":42,"tag":156,"props":1797,"children":1798},{},[1799],{"type":47,"value":1301},{"type":42,"tag":156,"props":1801,"children":1802},{},[1803],{"type":47,"value":170},{"type":42,"tag":156,"props":1805,"children":1806},{},[1807],{"type":47,"value":1310},{"type":42,"tag":177,"props":1809,"children":1810},{},[1811,1832,1853,1874,1895,1916,1937,1958,1979],{"type":42,"tag":152,"props":1812,"children":1813},{},[1814,1823,1827],{"type":42,"tag":184,"props":1815,"children":1816},{},[1817],{"type":42,"tag":741,"props":1818,"children":1820},{"href":1819},"references\u002Fbundle-barrel-exports.md",[1821],{"type":47,"value":1822},"bundle-barrel-exports.md",{"type":42,"tag":184,"props":1824,"children":1825},{},[1826],{"type":47,"value":198},{"type":42,"tag":184,"props":1828,"children":1829},{},[1830],{"type":47,"value":1831},"Avoid barrel imports",{"type":42,"tag":152,"props":1833,"children":1834},{},[1835,1844,1848],{"type":42,"tag":184,"props":1836,"children":1837},{},[1838],{"type":42,"tag":741,"props":1839,"children":1841},{"href":1840},"references\u002Fbundle-analyze-js.md",[1842],{"type":47,"value":1843},"bundle-analyze-js.md",{"type":42,"tag":184,"props":1845,"children":1846},{},[1847],{"type":47,"value":198},{"type":42,"tag":184,"props":1849,"children":1850},{},[1851],{"type":47,"value":1852},"JS bundle visualization",{"type":42,"tag":152,"props":1854,"children":1855},{},[1856,1865,1869],{"type":42,"tag":184,"props":1857,"children":1858},{},[1859],{"type":42,"tag":741,"props":1860,"children":1862},{"href":1861},"references\u002Fbundle-tree-shaking.md",[1863],{"type":47,"value":1864},"bundle-tree-shaking.md",{"type":42,"tag":184,"props":1866,"children":1867},{},[1868],{"type":47,"value":252},{"type":42,"tag":184,"props":1870,"children":1871},{},[1872],{"type":47,"value":1873},"Dead code elimination",{"type":42,"tag":152,"props":1875,"children":1876},{},[1877,1886,1890],{"type":42,"tag":184,"props":1878,"children":1879},{},[1880],{"type":42,"tag":741,"props":1881,"children":1883},{"href":1882},"references\u002Fbundle-analyze-app.md",[1884],{"type":47,"value":1885},"bundle-analyze-app.md",{"type":42,"tag":184,"props":1887,"children":1888},{},[1889],{"type":47,"value":252},{"type":42,"tag":184,"props":1891,"children":1892},{},[1893],{"type":47,"value":1894},"App size analysis",{"type":42,"tag":152,"props":1896,"children":1897},{},[1898,1907,1911],{"type":42,"tag":184,"props":1899,"children":1900},{},[1901],{"type":42,"tag":741,"props":1902,"children":1904},{"href":1903},"references\u002Fbundle-r8-android.md",[1905],{"type":47,"value":1906},"bundle-r8-android.md",{"type":42,"tag":184,"props":1908,"children":1909},{},[1910],{"type":47,"value":252},{"type":42,"tag":184,"props":1912,"children":1913},{},[1914],{"type":47,"value":1915},"Android code shrinking",{"type":42,"tag":152,"props":1917,"children":1918},{},[1919,1928,1932],{"type":42,"tag":184,"props":1920,"children":1921},{},[1922],{"type":42,"tag":741,"props":1923,"children":1925},{"href":1924},"references\u002Fbundle-hermes-mmap.md",[1926],{"type":47,"value":1927},"bundle-hermes-mmap.md",{"type":42,"tag":184,"props":1929,"children":1930},{},[1931],{"type":47,"value":252},{"type":42,"tag":184,"props":1933,"children":1934},{},[1935],{"type":47,"value":1936},"Disable bundle compression",{"type":42,"tag":152,"props":1938,"children":1939},{},[1940,1949,1953],{"type":42,"tag":184,"props":1941,"children":1942},{},[1943],{"type":42,"tag":741,"props":1944,"children":1946},{"href":1945},"references\u002Fbundle-native-assets.md",[1947],{"type":47,"value":1948},"bundle-native-assets.md",{"type":42,"tag":184,"props":1950,"children":1951},{},[1952],{"type":47,"value":252},{"type":42,"tag":184,"props":1954,"children":1955},{},[1956],{"type":47,"value":1957},"Asset catalog setup",{"type":42,"tag":152,"props":1959,"children":1960},{},[1961,1970,1974],{"type":42,"tag":184,"props":1962,"children":1963},{},[1964],{"type":42,"tag":741,"props":1965,"children":1967},{"href":1966},"references\u002Fbundle-library-size.md",[1968],{"type":47,"value":1969},"bundle-library-size.md",{"type":42,"tag":184,"props":1971,"children":1972},{},[1973],{"type":47,"value":343},{"type":42,"tag":184,"props":1975,"children":1976},{},[1977],{"type":47,"value":1978},"Evaluate dependencies",{"type":42,"tag":152,"props":1980,"children":1981},{},[1982,1991,1995],{"type":42,"tag":184,"props":1983,"children":1984},{},[1985],{"type":42,"tag":741,"props":1986,"children":1988},{"href":1987},"references\u002Fbundle-code-splitting.md",[1989],{"type":47,"value":1990},"bundle-code-splitting.md",{"type":42,"tag":184,"props":1992,"children":1993},{},[1994],{"type":47,"value":343},{"type":42,"tag":184,"props":1996,"children":1997},{},[1998],{"type":47,"value":1999},"Remote chunk loading safeguards",{"type":42,"tag":50,"props":2001,"children":2003},{"id":2002},"problem-skill-mapping",[2004],{"type":47,"value":2005},"Problem → Skill Mapping",{"type":42,"tag":144,"props":2007,"children":2008},{},[2009,2025],{"type":42,"tag":148,"props":2010,"children":2011},{},[2012],{"type":42,"tag":152,"props":2013,"children":2014},{},[2015,2020],{"type":42,"tag":156,"props":2016,"children":2017},{},[2018],{"type":47,"value":2019},"Problem",{"type":42,"tag":156,"props":2021,"children":2022},{},[2023],{"type":47,"value":2024},"Start With",{"type":42,"tag":177,"props":2026,"children":2027},{},[2028,2049,2069,2089,2109,2129,2144,2164,2179,2194,2214],{"type":42,"tag":152,"props":2029,"children":2030},{},[2031,2036],{"type":42,"tag":184,"props":2032,"children":2033},{},[2034],{"type":47,"value":2035},"App feels slow\u002Fjanky",{"type":42,"tag":184,"props":2037,"children":2038},{},[2039,2043,2045],{"type":42,"tag":741,"props":2040,"children":2041},{"href":1369},[2042],{"type":47,"value":1372},{"type":47,"value":2044}," → ",{"type":42,"tag":741,"props":2046,"children":2047},{"href":1343},[2048],{"type":47,"value":1346},{"type":42,"tag":152,"props":2050,"children":2051},{},[2052,2057],{"type":42,"tag":184,"props":2053,"children":2054},{},[2055],{"type":47,"value":2056},"Too many re-renders",{"type":42,"tag":184,"props":2058,"children":2059},{},[2060,2064,2065],{"type":42,"tag":741,"props":2061,"children":2062},{"href":1343},[2063],{"type":47,"value":1346},{"type":47,"value":2044},{"type":42,"tag":741,"props":2066,"children":2067},{"href":1453},[2068],{"type":47,"value":1456},{"type":42,"tag":152,"props":2070,"children":2071},{},[2072,2077],{"type":42,"tag":184,"props":2073,"children":2074},{},[2075],{"type":47,"value":2076},"Slow startup (TTI)",{"type":42,"tag":184,"props":2078,"children":2079},{},[2080,2084,2085],{"type":42,"tag":741,"props":2081,"children":2082},{"href":1615},[2083],{"type":47,"value":1618},{"type":47,"value":2044},{"type":42,"tag":741,"props":2086,"children":2087},{"href":1840},[2088],{"type":47,"value":1843},{"type":42,"tag":152,"props":2090,"children":2091},{},[2092,2097],{"type":42,"tag":184,"props":2093,"children":2094},{},[2095],{"type":47,"value":2096},"Large app size",{"type":42,"tag":184,"props":2098,"children":2099},{},[2100,2104,2105],{"type":42,"tag":741,"props":2101,"children":2102},{"href":1882},[2103],{"type":47,"value":1885},{"type":47,"value":2044},{"type":42,"tag":741,"props":2106,"children":2107},{"href":1903},[2108],{"type":47,"value":1906},{"type":42,"tag":152,"props":2110,"children":2111},{},[2112,2117],{"type":42,"tag":184,"props":2113,"children":2114},{},[2115],{"type":47,"value":2116},"Memory growing",{"type":42,"tag":184,"props":2118,"children":2119},{},[2120,2124,2125],{"type":42,"tag":741,"props":2121,"children":2122},{"href":1390},[2123],{"type":47,"value":1393},{"type":47,"value":464},{"type":42,"tag":741,"props":2126,"children":2127},{"href":1741},[2128],{"type":47,"value":1744},{"type":42,"tag":152,"props":2130,"children":2131},{},[2132,2137],{"type":42,"tag":184,"props":2133,"children":2134},{},[2135],{"type":47,"value":2136},"Animation drops frames",{"type":42,"tag":184,"props":2138,"children":2139},{},[2140],{"type":42,"tag":741,"props":2141,"children":2142},{"href":1474},[2143],{"type":47,"value":1477},{"type":42,"tag":152,"props":2145,"children":2146},{},[2147,2152],{"type":42,"tag":184,"props":2148,"children":2149},{},[2150],{"type":47,"value":2151},"Bottom sheet jank\u002Fre-renders",{"type":42,"tag":184,"props":2153,"children":2154},{},[2155,2159,2160],{"type":42,"tag":741,"props":2156,"children":2157},{"href":1495},[2158],{"type":47,"value":1498},{"type":47,"value":2044},{"type":42,"tag":741,"props":2161,"children":2162},{"href":1474},[2163],{"type":47,"value":1477},{"type":42,"tag":152,"props":2165,"children":2166},{},[2167,2172],{"type":42,"tag":184,"props":2168,"children":2169},{},[2170],{"type":47,"value":2171},"List scroll jank",{"type":42,"tag":184,"props":2173,"children":2174},{},[2175],{"type":42,"tag":741,"props":2176,"children":2177},{"href":1322},[2178],{"type":47,"value":1325},{"type":42,"tag":152,"props":2180,"children":2181},{},[2182,2187],{"type":42,"tag":184,"props":2183,"children":2184},{},[2185],{"type":47,"value":2186},"TextInput lag",{"type":42,"tag":184,"props":2188,"children":2189},{},[2190],{"type":42,"tag":741,"props":2191,"children":2192},{"href":1516},[2193],{"type":47,"value":1519},{"type":42,"tag":152,"props":2195,"children":2196},{},[2197,2202],{"type":42,"tag":184,"props":2198,"children":2199},{},[2200],{"type":47,"value":2201},"Native module slow",{"type":42,"tag":184,"props":2203,"children":2204},{},[2205,2209,2210],{"type":42,"tag":741,"props":2206,"children":2207},{"href":1573},[2208],{"type":47,"value":1576},{"type":47,"value":2044},{"type":42,"tag":741,"props":2211,"children":2212},{"href":1636},[2213],{"type":47,"value":1639},{"type":42,"tag":152,"props":2215,"children":2216},{},[2217,2222],{"type":42,"tag":184,"props":2218,"children":2219},{},[2220],{"type":47,"value":2221},"Native library alignment issue",{"type":42,"tag":184,"props":2223,"children":2224},{},[2225],{"type":42,"tag":741,"props":2226,"children":2227},{"href":1762},[2228],{"type":47,"value":1765},{"type":42,"tag":50,"props":2230,"children":2232},{"id":2231},"attribution",[2233],{"type":47,"value":2234},"Attribution",{"type":42,"tag":57,"props":2236,"children":2237},{},[2238],{"type":47,"value":2239},"Based on \"The Ultimate Guide to React Native Optimization\" by Callstack.",{"type":42,"tag":2241,"props":2242,"children":2243},"style",{},[2244],{"type":47,"value":2245},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":2247,"total":2350},[2248,2266,2278,2296,2310,2316,2331],{"slug":2249,"name":2249,"fn":2250,"description":2251,"org":2252,"tags":2253,"stars":23,"repoUrl":24,"updatedAt":2265},"assess-react-native-migration","assess mobile product React Native migration","Assesses whether and how an existing mobile product should migrate to React Native. Use when auditing one or more product repositories for migration readiness, including products whose iOS, Android, and other clients live in separate directories or repositories; choosing brownfield, greenfield, or a checkpoint-based path; defining a representative trial; or preparing a baseline and ROI decision before implementation. When product scope or material evidence is unavailable, grills the stakeholder with exactly one question per turn instead of sending a questionnaire.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2254,2257,2260,2263,2264],{"name":2255,"slug":2256,"type":16},"Android","android",{"name":2258,"slug":2259,"type":16},"iOS","ios",{"name":2261,"slug":2262,"type":16},"Migration","migration",{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},"2026-07-11T05:40:57.94641",{"slug":2267,"name":2267,"fn":2268,"description":2269,"org":2270,"tags":2271,"stars":23,"repoUrl":24,"updatedAt":2277},"create-react-native-library","scaffold React Native libraries","Scaffolds React Native libraries with create-react-native-library for standalone libraries or local native modules and views. Use when creating or working on React Native libraries or adding native functionality in an existing app.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2272,2275,2276],{"name":2273,"slug":2274,"type":16},"Engineering","engineering",{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},"2026-06-26T07:57:53.098041",{"slug":2279,"name":2279,"fn":2280,"description":2281,"org":2282,"tags":2283,"stars":23,"repoUrl":24,"updatedAt":2295},"github","manage GitHub PRs with gh CLI","GitHub patterns using gh CLI for pull requests, stacked PRs, code review, branching strategies, and repository automation. Use when working with GitHub PRs, merging strategies, or repository management tasks.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2284,2287,2290,2292],{"name":2285,"slug":2286,"type":16},"CLI","cli",{"name":2288,"slug":2289,"type":16},"Code Review","code-review",{"name":2291,"slug":2279,"type":16},"GitHub",{"name":2293,"slug":2294,"type":16},"Pull Requests","pull-requests","2026-04-06T18:06:37.430056",{"slug":2297,"name":2297,"fn":2298,"description":2299,"org":2300,"tags":2301,"stars":23,"repoUrl":24,"updatedAt":2309},"github-actions","build React Native apps in GitHub Actions","GitHub Actions workflow patterns for React Native iOS simulator and Android emulator cloud builds with downloadable artifacts. Use when setting up CI build pipelines or downloading GitHub Actions artifacts via gh CLI and GitHub API.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2302,2305,2307,2308],{"name":2303,"slug":2304,"type":16},"CI\u002FCD","cicd",{"name":2306,"slug":2297,"type":16},"GitHub Actions",{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},"2026-04-06T18:06:38.661459",{"slug":4,"name":4,"fn":5,"description":6,"org":2311,"tags":2312,"stars":23,"repoUrl":24,"updatedAt":25},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2313,2314,2315],{"name":21,"slug":22,"type":16},{"name":14,"slug":15,"type":16},{"name":18,"slug":19,"type":16},{"slug":2317,"name":2317,"fn":2318,"description":2319,"org":2320,"tags":2321,"stars":23,"repoUrl":24,"updatedAt":2330},"react-native-brownfield-migration","migrate native apps to React Native","Implements an accepted incremental brownfield migration from native iOS or Android to React Native or Expo using @callstack\u002Freact-native-brownfield. Use after the brownfield path has been selected, when setting up the integration, packaging XCFramework or AAR artifacts, or adding React Native surfaces to native hosts.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2322,2323,2326,2327,2328,2329],{"name":2255,"slug":2256,"type":16},{"name":2324,"slug":2325,"type":16},"Expo","expo",{"name":2258,"slug":2259,"type":16},{"name":2261,"slug":2262,"type":16},{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},"2026-04-06T18:06:42.392689",{"slug":2332,"name":2332,"fn":2333,"description":2334,"org":2335,"tags":2336,"stars":23,"repoUrl":24,"updatedAt":2349},"react-native-tv-best-practices","review React Native TV application quality","Reviews React Native TV apps for focus\u002FD-pad navigation, 10-foot UI layout, TV playback\u002FDRM integration, low-memory TV performance, and TV accessibility. Use when building, debugging, or reviewing react-native-tvos, Expo TV, Amazon Vega\u002FKepler, or React Native web TV targets where the issue depends on remote input, TV focus, TV packaging, TV hardware, or TV playback constraints.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2337,2340,2343,2344,2345,2346],{"name":2338,"slug":2339,"type":16},"Accessibility","accessibility",{"name":2341,"slug":2342,"type":16},"Frontend","frontend",{"name":21,"slug":22,"type":16},{"name":14,"slug":15,"type":16},{"name":18,"slug":19,"type":16},{"name":2347,"slug":2348,"type":16},"UI Components","ui-components","2026-06-28T08:04:16.29881",9,{"items":2352,"total":2477},[2353,2361,2367,2374,2381,2387,2396,2405,2420,2432,2449,2463],{"slug":2249,"name":2249,"fn":2250,"description":2251,"org":2354,"tags":2355,"stars":23,"repoUrl":24,"updatedAt":2265},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2356,2357,2358,2359,2360],{"name":2255,"slug":2256,"type":16},{"name":2258,"slug":2259,"type":16},{"name":2261,"slug":2262,"type":16},{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},{"slug":2267,"name":2267,"fn":2268,"description":2269,"org":2362,"tags":2363,"stars":23,"repoUrl":24,"updatedAt":2277},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2364,2365,2366],{"name":2273,"slug":2274,"type":16},{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},{"slug":2279,"name":2279,"fn":2280,"description":2281,"org":2368,"tags":2369,"stars":23,"repoUrl":24,"updatedAt":2295},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2370,2371,2372,2373],{"name":2285,"slug":2286,"type":16},{"name":2288,"slug":2289,"type":16},{"name":2291,"slug":2279,"type":16},{"name":2293,"slug":2294,"type":16},{"slug":2297,"name":2297,"fn":2298,"description":2299,"org":2375,"tags":2376,"stars":23,"repoUrl":24,"updatedAt":2309},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2377,2378,2379,2380],{"name":2303,"slug":2304,"type":16},{"name":2306,"slug":2297,"type":16},{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},{"slug":4,"name":4,"fn":5,"description":6,"org":2382,"tags":2383,"stars":23,"repoUrl":24,"updatedAt":25},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2384,2385,2386],{"name":21,"slug":22,"type":16},{"name":14,"slug":15,"type":16},{"name":18,"slug":19,"type":16},{"slug":2317,"name":2317,"fn":2318,"description":2319,"org":2388,"tags":2389,"stars":23,"repoUrl":24,"updatedAt":2330},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2390,2391,2392,2393,2394,2395],{"name":2255,"slug":2256,"type":16},{"name":2324,"slug":2325,"type":16},{"name":2258,"slug":2259,"type":16},{"name":2261,"slug":2262,"type":16},{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},{"slug":2332,"name":2332,"fn":2333,"description":2334,"org":2397,"tags":2398,"stars":23,"repoUrl":24,"updatedAt":2349},{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2399,2400,2401,2402,2403,2404],{"name":2338,"slug":2339,"type":16},{"name":2341,"slug":2342,"type":16},{"name":21,"slug":22,"type":16},{"name":14,"slug":15,"type":16},{"name":18,"slug":19,"type":16},{"name":2347,"slug":2348,"type":16},{"slug":2406,"name":2406,"fn":2407,"description":2408,"org":2409,"tags":2410,"stars":23,"repoUrl":24,"updatedAt":2419},"react-navigation","configure React Navigation UI patterns","Provides React Navigation UI patterns for stacks, tabs, drawers etc. Use when building navigation UIs with React Navigation, configuring headers, bottom sheets or handling safe areas and insets.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2411,2412,2413,2416],{"name":2341,"slug":2342,"type":16},{"name":21,"slug":22,"type":16},{"name":2414,"slug":2415,"type":16},"Navigation","navigation",{"name":2417,"slug":2418,"type":16},"React","react","2026-06-26T07:57:54.478042",{"slug":2421,"name":2421,"fn":2422,"description":2423,"org":2424,"tags":2425,"stars":23,"repoUrl":24,"updatedAt":2431},"upgrading-react-native","upgrade React Native apps","Upgrades React Native apps to newer versions by applying rn-diff-purge template diffs, updating package.json dependencies, migrating native iOS and Android configuration, resolving CocoaPods and Gradle changes, and handling breaking API updates. Use when upgrading React Native, bumping RN version, updating from RN 0.x to 0.y, or migrating Expo SDK alongside a React Native upgrade.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2426,2427,2428,2429,2430],{"name":2255,"slug":2256,"type":16},{"name":2258,"slug":2259,"type":16},{"name":2261,"slug":2262,"type":16},{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},"2026-04-06T18:06:39.914409",{"slug":2433,"name":2433,"fn":2434,"description":2435,"org":2436,"tags":2437,"stars":2446,"repoUrl":2447,"updatedAt":2448},"react-native-ai-skills","integrate on-device AI in React Native","Provides integration recipes for the React Native AI @react-native-ai packages that wrap the Llama.rn (Llama.cpp), MLC-LLM, Apple Foundation backends. Use when integrating local on-device AI in React Native, setting up providers, model management.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2438,2441,2444,2445],{"name":2439,"slug":2440,"type":16},"AI Infrastructure","ai-infrastructure",{"name":2442,"slug":2443,"type":16},"LLM","llm",{"name":21,"slug":22,"type":16},{"name":18,"slug":19,"type":16},1371,"https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Fai","2026-04-06T18:06:48.66379",{"slug":2450,"name":2450,"fn":2451,"description":2452,"org":2453,"tags":2454,"stars":2460,"repoUrl":2461,"updatedAt":2462},"voltra","build Voltra iOS widgets and charts","Build, review, refactor, configure, or debug Voltra code using Voltra JSX, Voltra JS APIs, the Expo config plugin, and the Voltra CLI. Use when the user asks about charts, Live Activities, Dynamic Island UI, iOS widgets, scheduled widgets, Android widgets, ongoing notifications, image handling, app.json plugin config, React Native CLI setup, or Voltra push update flows.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2455,2456,2457,2458],{"name":2324,"slug":2325,"type":16},{"name":2258,"slug":2259,"type":16},{"name":21,"slug":22,"type":16},{"name":2459,"slug":2450,"type":16},"Voltra",787,"https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Fvoltra","2026-04-06T18:06:47.399012",{"slug":2464,"name":2464,"fn":2465,"description":2466,"org":2467,"tags":2468,"stars":2474,"repoUrl":2475,"updatedAt":2476},"rozenite-agent","use Rozenite plugins for React Native devtools","Use Rozenite for Agents through CLI-driven `rozenite agent` commands to inspect React Native DevTools data and Rozenite plugins on a live app target. Trigger this skill for shell-based debugging and live session work. For Node.js or TypeScript scripts, wrappers, automations, or other programmatic SDK usage, use `rozenite-agent-sdk` instead.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":11},[2469,2470,2473],{"name":21,"slug":22,"type":16},{"name":2471,"slug":2472,"type":16},"Plugin Development","plugin-development",{"name":18,"slug":19,"type":16},633,"https:\u002F\u002Fgithub.com\u002Fcallstackincubator\u002Frozenite","2026-07-31T05:52:54.56302",15]