[0.73.x] Metro crashes because of __loadBundleAsync

[huextrat]

Description

From 0.73 metro do lazy bundling as explained in the following proposal:

https://github.com/react-native-community/discussions-and-proposals/blob/main/proposals/0605-lazy-bundling.md#__loadbundleasync-in-metro

Launching iOS & Android apps simultaneously in debug and opening a screen with some lazy components cause metro to bundle those components. After a few seconds, metro is crashing with a JS out of memory:

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

For now, we have a workaround in metro.config.js to disable lazy loading from metro:

const config = {
  server: {
    rewriteRequestUrl: (url) => {
      return url.replace("&lazy=true", "&lazy=false");
    },
  },
};

Why this feature has been enabled on RN ? It degrades the DX by slowing down every interaction within a debug app.

Steps to reproduce

1. Install the debug app on iOS & Android
2. Start the app on both devices
3. Open a screen with lazy components
4. Metro is crashing

React Native Version

0.73.0

Affected Platforms

Runtime - Android, Runtime - iOS

Output of npx react-native info

System:
  OS: macOS 14.2.1
  CPU: (8) arm64 Apple M1 Pro
  Memory: 57.34 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.9.0
    path: /private/var/folders/xb/bns2zty1799942jnf2sx7tvr0000gn/T/xfs-421792d4/node
  Yarn:
    version: 4.0.2
    path: /private/var/folders/xb/bns2zty1799942jnf2sx7tvr0000gn/T/xfs-421792d4/yarn
  npm:
    version: 10.1.0
    path: ~/.nvm/versions/node/v20.9.0/bin/npm
  Watchman:
    version: 2023.09.04.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.14.3
    path: /Users/hugo/.rvm/gems/ruby-3.0.0/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.2
      - iOS 17.2
      - macOS 14.2
      - tvOS 17.2
      - visionOS 1.0
      - watchOS 10.2
  Android SDK:
    API Levels:
      - "23"
      - "26"
      - "28"
      - "31"
      - "33"
      - "34"
    Build Tools:
      - 30.0.3
      - 33.0.0
      - 33.0.1
      - 33.0.2
      - 34.0.0
    System Images:
      - android-23 | ARM 64 v8a
      - android-24 | ARM 64 v8a
      - android-28 | Google APIs ARM 64 v8a
      - android-28 | Google ARM64-V8a Play ARM 64 v8a
      - android-28 | Google Play Intel x86 Atom
      - android-28 | Google Play Intel x86_64 Atom
      - android-31 | Google Play ARM 64 v8a
      - android-33 | Google APIs ARM 64 v8a
      - android-33 | Google Play ARM 64 v8a
      - android-34 | Google APIs ARM 64 v8a
    Android NDK: 22.1.7171670
IDEs:
  Android Studio: 2023.1 AI-231.9392.1.2311.11255304
  Xcode:
    version: 15.2/15C500b
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.9
    path: /usr/bin/javac
  Ruby:
    version: 3.0.0
    path: /Users/hugo/.rvm/rubies/ruby-3.0.0/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.73.2
    wanted: 0.73.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Stacktrace or Logs

<--- Last few GCs --->

[6434:0x150008000]   168011 ms: Mark-Compact 4049.1 (4137.2) -> 4045.5 (4142.0) MB, 4280.29 / 0.50 ms  (average mu = 0.257, current mu = 0.030) allocation failure; scavenge might not succeed
[6434:0x150008000]   182429 ms: Mark-Compact 4054.1 (4142.6) -> 4042.4 (4153.1) MB, 14400.83 / 0.04 ms  (average mu = 0.061, current mu = 0.001) allocation failure; scavenge might not succeed


<--- JS stacktrace --->

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
 1: 0x1047b2114 node::Abort() [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 2: 0x1047b22fc node::ModifyCodeGenerationFromStrings(v8::Local<v8::Context>, v8::Local<v8::Value>, bool) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 3: 0x104939048 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 4: 0x104b0d82c v8::internal::Heap::GarbageCollectionReasonToString(v8::internal::GarbageCollectionReason) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 5: 0x104b0c308 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 6: 0x104b02b20 v8::internal::HeapAllocator::AllocateRawWithLightRetrySlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 7: 0x104b03380 v8::internal::HeapAllocator::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 8: 0x104ae7c48 v8::internal::Factory::AllocateRaw(int, v8::internal::AllocationType, v8::internal::AllocationAlignment) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
 9: 0x104ade228 v8::internal::MaybeHandle<v8::internal::SeqOneByteString> v8::internal::FactoryBase<v8::internal::Factory>::NewRawStringWithMap<v8::internal::SeqOneByteString>(int, v8::internal::Map, v8::internal::AllocationType) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
10: 0x104ded45c v8::internal::String::SlowFlatten(v8::internal::Isolate*, v8::internal::Handle<v8::internal::ConsString>, v8::internal::AllocationType) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
11: 0x104ee8964 v8::internal::Runtime_StringCharCodeAt(int, unsigned long*, v8::internal::Isolate*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
12: 0x10522cc44 Builtins_CEntry_Return1_ArgvOnStack_NoBuiltinExit [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
13: 0x10a97b910 
14: 0x10a7b497c 
15: 0x10a7cefb4 
16: 0x10a7d56f4 
17: 0x10a7d8510 
18: 0x10a7eb38c 
19: 0x10a8b48bc 
20: 0x10a8a1020 
21: 0x1051db210 Builtins_AsyncFunctionAwaitResolveClosure [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
22: 0x105288fb8 Builtins_PromiseFulfillReactionJob [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
23: 0x1051cab94 Builtins_RunMicrotasks [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
24: 0x1051a23f4 Builtins_JSRunMicrotasksEntry [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
25: 0x104a7ac94 v8::internal::(anonymous namespace)::Invoke(v8::internal::Isolate*, v8::internal::(anonymous namespace)::InvokeParams const&) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
26: 0x104a7b180 v8::internal::(anonymous namespace)::InvokeWithTryCatch(v8::internal::Isolate*, v8::internal::(anonymous namespace)::InvokeParams const&) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
27: 0x104a7b35c v8::internal::Execution::TryRunMicrotasks(v8::internal::Isolate*, v8::internal::MicrotaskQueue*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
28: 0x104aa2418 v8::internal::MicrotaskQueue::RunMicrotasks(v8::internal::Isolate*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
29: 0x104aa2bb4 v8::internal::MicrotaskQueue::PerformCheckpoint(v8::Isolate*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
30: 0x1051a5ef0 Builtins_CallApiCallback [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
31: 0x10a7ab35c 
32: 0x1051a250c Builtins_JSEntryTrampoline [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
33: 0x1051a21f4 Builtins_JSEntry [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
34: 0x104a7acbc v8::internal::(anonymous namespace)::Invoke(v8::internal::Isolate*, v8::internal::(anonymous namespace)::InvokeParams const&) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
35: 0x104a7a108 v8::internal::Execution::Call(v8::internal::Isolate*, v8::internal::Handle<v8::internal::Object>, v8::internal::Handle<v8::internal::Object>, int, v8::internal::Handle<v8::internal::Object>*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
36: 0x1049549d4 v8::Function::Call(v8::Local<v8::Context>, v8::Local<v8::Value>, int, v8::Local<v8::Value>*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
37: 0x1046e4d3c node::InternalCallbackScope::Close() [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
38: 0x1046e501c node::InternalMakeCallback(node::Environment*, v8::Local<v8::Object>, v8::Local<v8::Object>, v8::Local<v8::Function>, int, v8::Local<v8::Value>*, node::async_context) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
39: 0x1046fb48c node::AsyncWrap::MakeCallback(v8::Local<v8::Function>, int, v8::Local<v8::Value>*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
40: 0x10487f1a4 node::StreamBase::CallJSOnreadMethod(long, v8::Local<v8::ArrayBuffer>, unsigned long, node::StreamBase::StreamBaseJSChecks) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
41: 0x104880838 node::EmitToJSStreamListener::OnStreamRead(long, uv_buf_t const&) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
42: 0x104884b2c node::LibuvStreamWrap::OnUvRead(long, uv_buf_t const*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
43: 0x1048852b0 node::LibuvStreamWrap::ReadStart()::$_1::__invoke(uv_stream_s*, long, uv_buf_t const*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
44: 0x10518ef70 uv__stream_io [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
45: 0x105196874 uv__io_poll [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
46: 0x105184d60 uv_run [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
47: 0x1046e5754 node::SpinEventLoopInternal(node::Environment*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
48: 0x1047f5138 node::NodeMainInstance::Run(node::ExitCode*, node::Environment*) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
49: 0x1047f4ed4 node::NodeMainInstance::Run() [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
50: 0x10477d60c node::Start(int, char**) [/Users/hugo/.nvm/versions/node/v20.9.0/bin/node]
51: 0x18ccf90e0 start [/usr/lib/dyld]

Reproducer

private repo

Screenshots and Videos

No response

[github-actions]

⚠️

Newer Version of React Native is Available!

ℹ️

You are on a supported minor version, but it looks like there's a newer patch available - 0.73.2. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases.

[github-actions]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template. A reproducer needs to be in a GitHub repository under your username.

[cortinico]

Passing on to Metro

[robhogan]

Hi @huextrat, thanks for the report.

Install the debug app on iOS & Android
Start the app on both devices
Open a screen with lazy components
Metro is crashing

I've just tried this with a fresh app and haven't been able to reproduce a crash or anything that'd suggest a leak. Are you able to reproduce outside your private app at all?

I wouldn't expect enabling lazy bundling in itself to increase memory usage particularly, but many parallel bundling requests might be too much.

You can try starting Metro with debug logging and experimenting with the memory limit - if you could record a video demonstrating the behaviour you're seeing, that might help us see what's going on. If you don't want to share publicly, feel free to email my GitHub username @ meta.com.

DEBUG=Metro:* NODE_OPTIONS=--max-old-space-size=8192 yarn start`

[cortinico]

Are you able to reproduce outside your private app at all?

@huextrat if you need, you can use this reproducer template https://github.com/react-native-community/reproducer-react-native

[huextrat]

Thx @robhogan, I've just e-mailed videos showing the problem.

Increasing node memory limit seems to fix the issue, was not able to reproduce with --max-old-space-size=8192.

I'm trying to create a project to reproduce when I have a bit of time, but it might be complicated. The problem only seems to arise if the load on the metro is high, which I think implies a project of a certain size.