Implement Hermes bytecode precompilation for critical React Native screens

[Smartdevs17]

Context

SubTrackr uses Hermes as the JavaScript engine for React Native, which supports precompilation of JavaScript bundles to Hermes bytecode (.hbc). Currently, the entire JS bundle is compiled as a single unit, missing opportunities for differential loading and critical-path optimization. Key subscription management screens—Home, SubscriptionDetail, Analytics, and Payment—can benefit from precompiled bytecode segments loaded on demand.
\

\

Current Limitation

\

• Single monolithic JS bundle compiled to Hermes bytecode
  \
• No lazy loading of precompiled screen-level bytecode chunks
  \
• Startup time includes parsing/compilation of infrequently-used screens
  \
• Memory usage includes bytecode for all screens, not just active ones
  \
• Performance budget for startup (2s) may degrade as screen count grows
  \

\

Expected Outcome

Differential Hermes bytecode compilation with lazy-loaded screen chunks: critical path screens are precompiled and loaded eagerly; less-frequently-used screens are compiled on-demand, reducing initial bundle size, startup time, and peak memory usage.
\

\

Acceptance Criteria

\

• Metro bundler configured to emit per-screen Hermes bytecode chunks
  \
• Critical screens (Home, SubscriptionDetail, Analytics, Payment) precompiled eagerly
  \
• Non-critical screens compiled and loaded on-demand
  \
• Startup time improvement of >=30% against performance budget (2s target)
  \
• Peak memory usage reduction of >=20%
  \
• Lazy chunk loading does not introduce visible jank (>16ms frame drops)
  \
• Fallback to full bundle when bytecode chunks unavailable
  \
• Integration with existing performance budget enforcement script
  \
• Documentation for configuring screen-level compilation tiers
  \

\

Technical Scope

\

• Files: metro.config.js, babel.config.js, src/navigation/AppNavigator.tsx, scripts/check-performance-budget.js, app.config.js
  \
• APIs: Metro bundler HBC plugin, React.lazy + Suspense, Hermes -emit-binary flag
  \
• Edge cases: Screen transitions during chunk load, Hermes engine version mismatch, OTA update bytecode compatibility, debug builds not using bytecode, bytecode cache invalidation

[distributed-nerd]

@distributed-nerd has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

can i work on this

ℹ️ Repo Maintainers: To accept this application, review their application or assign @distributed-nerd to this issue.

[drips-wave]

Congratulations, @distributed-nerd! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 30, 2026.

🧑‍💻 @distributed-nerd: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊