Is it performant to use Babylon Native with the React Native architecture?

Hello! I would love to use babylon for my next mobile game. But I am just worried about the performance compared with something like Unity.

Does react-native have an impact on performance? If so, is it possible to compile my app without React-Native, just Babylon Native and another UX system (Babylon-GUI)?

Hi @Enzo and welcome to the community!

Short answer, in my experience, yes React Native does have an impact.

Long answer, it depends on …

  • Choice of JavaScript engine i.e. default Hermes, JavaScriptCore or V8 (the latter is fastest but also the most difficult to get going with recent versions of React Native)
  • Complexity of React UI - if you have a relatively simple UI it shouldn’t have too big an impact
  • Choice of React Native UI library - we use React Native Paper but I gather there are newer, more performant UI frameworks out there which we’ve yet to investigate
  • Quality of your React code - React is relative easy to do, but a bitch to do well …

React Native is a single-threaded environment, so that’s been a major limiting factor for us. The React Native New Architecture and Concurrency promises to alleviate this constraint but it’s not really an option until it’s stable and third-party libraries have updated, so we’re stuck on the old architecture.

In benchmarking we’ve done to compare performance between the browser, Babylon React Native with Hermes, Babylon React Native with JSC, Babylon React Native with V8 and React Native with the Babylon.js code running in a WebView … on the same hardware, the performance is surprisingly comparable, but that’s with a simple React Native app - as the app complexity increases, so do the demands on the CPU and overall performance suffers.

My advice would be:

  • Separate your game logic and rendering code into a platform agnostic JS API module, so you can integrate it any way you like (Babylon React Native, Babylon Native, web etc)
  • Focus on web dev first as it allows for faster iterations, better hot reloading, more debugging and profiling options than React Native, then integrate with React Native later, when your code is stable
  • Don’t choose React Native for performance - I think the main reason for choosing it is developer familiarity with React, but it’s not without its problems and frustrations
2 Likes

Wow, thank you for the long and deep answer.

About what you said of single-threaded in RN, I guess you are talking about using (web)workers or something like that? To have the React UX in one threat/worker and the Babylon scene in another? Is that correct?

Also, can Babylon Native be multi-thread? If not now, maybe in the future?

cc our @BabylonNative team

1 Like

Babylon Native currently does not yet have web worker support to enable multi-threading on the JS side, but implementing native components using threading and exposing the components to JS is possible.

This doc can help maybe: Multiple Platforms | Babylon.js Documentation (babylonjs.com)

Specifically this may help: BabylonNative/Documentation/WhenToUseBabylonNative.md at master · BabylonJS/BabylonNative (github.com)

And finally, iOS has more performance issues due to Apple disallowing JIT on that platform. If iOS is a target, it might be good to make sure the performance is acceptable on that platform first.

2 Likes