melonJS icon indicating copy to clipboard operation
melonJS copied to clipboard

[Feature request] Support React Native?

Open L1lith opened this issue 3 years ago • 6 comments

Is your feature request related to a problem? Please describe. Johannes Stein describes the architecture differences between React Native and Cordova

Cordova

On mobile devices, Cordova is running a single-page application inside the integrated mobile web browser, called WebView, and then wrapping that as a native application. While it looks like a native application from the outside, our web code is running inside the mobile browser engine.

React Native

React Native has its own packager. It bundles all the JavaScript files into one giant file, which is then consumed and executed by JavaScriptCore, Apple’s JavaScript engine. JavaScriptCore is being used on iOS and Android, while ChakraCore is powering React Native UWP applications.

I think the advantage here is that we only need to run the JS engine, rather than run the entire browser (which has a lot of feature bloat)

Describe the solution you'd like We could build some kind of component system for making MelonJS games in React native (especially since we've already done the work to implement modules)

Describe alternatives you've considered I'm not sure I'm not an expert in mobile dev

Additional context I haven't yet tested the Cordova version, it would be good to do performance measurements

L1lith avatar Sep 28 '22 04:09 L1lith

I haven't use react native as a bundler, but one of the advantage of Cordova is (or was maybe since it's not being updated anymore) is all the monetisation plugins. Capacitor can use the Cordova plugins (assuming they have been updated), but I'm not sure about react native ?

obiot avatar Sep 29 '22 01:09 obiot

I haven't use react native as a bundler, but one of the advantage of Cordova is (or was maybe since it's not being updated anymore) is all the monetisation plugins. Capacitor can use the Cordova plugins (assuming they have been updated), but I'm not sure about react native ?

Here's one way someone did it, react native targets native device APIs (see the Android Native Modules and iOS native modules) so I think you should be able to use not only ad/monetization libraries made for your target platform, but you can also port any other features/libraries specific to your platform of choice.

L1lith avatar Sep 29 '22 02:09 L1lith

oh super interesting, I really need to look into it, thanks for sharing that !

obiot avatar Sep 30 '22 00:09 obiot

to come back on the original request on supporting react native, it seems that it could just about adding https://www.npmjs.com/package/@flyskywhy/react-native-gcanvas as part of the project boilerplate dependencies ?

we really need to try :)

obiot avatar Sep 30 '22 00:09 obiot

this one too: https://github.com/flyskywhy/react-native-browser-polyfill

obiot avatar Sep 30 '22 00:09 obiot

I'm really still favouring more capacitor though, to be honest : https://capacitorjs.com/blog/native-react-apps-without-react-native

obiot avatar Sep 30 '22 00:09 obiot

FYI, this project uses React and other framework/components with melonJS: https://github.com/l3wi/gearbox-ninja

point being that It does not seems like we need anything particular to be changed in melonJS, beside for the user to be bundling it with melonJS, so until/unless someone comes up with what (else) specifically we would be missing I will close this ticket.

also, as a reminder, in a previous version we added the possibility to provide a custom renderer: https://github.com/melonjs/melonJS/issues/1139

obiot avatar Jan 30 '23 00:01 obiot