iOS simulator not scrolling properly (M1 + React Native project)

12
votes

Running my React Native project on the simulator on my M1 MacBook Pro. ScrollViews do not scroll properly in the simulator. Only a problem on this setup with Big Sur and M1. Works on other computers and real devices.

When I swipe, the view scrolls but it takes a lot of "force" and view seems to lag as I scroll. Also, it stops as soon as I release the press (does not continue to scroll as expected).

Anyone else experiencing this issue?

Setup:

  • M1 mac
  • Rosetta-Terminal
  • Xcode 12.2, CoreSimulator 732.18.0.2 (iPhone 11, iOS 14.0)
  • React Native 0.63.2
1
iosreact-nativeapple-silicon

1 Answers

5
votes

There seems to be a bug in the iOS simulator with scroll events when not running arm64 images. See: https://developer.apple.com/forums/thread/668488

I was running into the same issue, and compiling to arm64 resolves the problem.

To do that, you will need to either:

  • Open and use XCode to compile instead of react-native run-ios.

  • Or, use native arm64 nodejs by installing node 15.3 from source via nvm install 15. Make sure that both of arch and node -p process.arch in the terminal print arm64.

Note that you will need to disable Flipper in your Podfile to be able to compile to the arm64 simulator target because of this issue: https://github.com/facebook/flipper/issues/1758

Additional info: https://github.com/facebook/react-native/pull/30543#issuecomment-740161332