2

I am trying to create a react based SDK, (i.e) I will be having an Android/iOS package which will be the entry point for an App and will be using react code for using existing business logic. I am able to see React's AppRegistry.registerComponent as the entry point for react app. But for my use case I don't have any view dependency. I only have business logics. How should I create the bundle?

In Android and iOS, I will be writing a script to copy paste the bundle that is created using this RN package to the asset folder and from there I will use this index.bundle to create ReactInstanceManager

Please help me understand will this workout (React based SDK without view components). What are the things I need to do for making this SDK.

Note: This SDK can be integrated in existing App which already having react-native dependency for rendering some screens. My SDK should handle this use case as well.

Manish Waran
  • 90
  • 10
  • Unclear how your problem is different than [Using a Library](https://reactnative.dev/docs/libraries) as your SDK. – Morrison Chang Dec 20 '20 at 07:15
  • In normal way, we will add dependency in iOS/Android side and we add package dependency in react-native package side as well. My use case is, the SDK can be consumed my client App which do not have dependency on react (no react rendering screens), but still I will instantiate ReactInstanceManger with the bundle that I have created inside the SDK and the App can use the SDK's api to execute some business logic in react side and fetch the output. – Manish Waran Dec 21 '20 at 02:37
  • 1
    If the client app doesn't have a dependency on React Native, then you are forcing your customers, app developers, to include React Native which is an involved process. If you want a SDK to be accepted by more developers (React Native, Flutter, Xamarin, Cordova, Ionic) then usually the SDK is written in native Java/Kotlin and/or ObjC/Swift. As each third-party framework platform has native connectors which would be use for communicating with the SDK. See Ad SDKs like Admob or Facebook Audience for examples. – Morrison Chang Dec 21 '20 at 03:56
  • I am aware of this. I have a requirement for 2P and not 3P (3rd party client). I am curious is it possible for implementing what I have mentioned in this question. – Manish Waran Dec 21 '20 at 15:35
  • So let’s say if the ios app uses your sdk, it will use your library as a framework I guess and your framework will be using react native internally. Is that a correct understanding? – manishg Dec 24 '20 at 01:41
  • Yes @manishg. My SDK should be able to run business logics which is written in react native through Hooks. Eg: Syncing local contacts to server – Manish Waran Dec 25 '20 at 04:47
  • I have done this before(still not sure if this is exactly you meant). You can check my sample code/example here: https://github.com/manishganvir/reactnative-framework-native2js – manishg Dec 25 '20 at 05:26

1 Answers1

2

You may not like my answer, but keep in mind I have been working on a couple of complex react-native projects the last couple years. So I'm talking from experience.

1.- This is a terrible idea. 2.- Is also possible.

Why is a terrible idea? A) Because you will bundle the full size of react-native within an app, regardless of usage. B) Because react-native is a rendering engine (and a very costly one). Is not designed for headless use. It has a non-trivial startup time, so your SDK will not be available right after starting the app. By default, ReactActivity stops the JS engine as soon as something covers up the UI (Like a permission dialog), leading to interesting and funny problems if your SDK is meant to be called at the same time. The bridging model involves a lot of latency, by design. The react-native dependencies may not match the ones from the app, leading to another host of problems. Is far easier to read by attackers, since is a big script any IDE can reformat. And depending on what your SDK needs to do, you may need to write a more complex bunch of native code. Build steps will require the consumer to use yarn/npm to build the app if you have JS dependencies, and will force the consumer to integrate react-native's hacky gradle steps (and into their CI tools too). If a react-native library gives you problems, you will have to patch it. So, lots of chances for trouble.

That said, you can create a JS bundle from whatever file you want by using the bundling commands (react-native bundle). So you can pack a non-UI JS functions and load them directly in a ReactActivity. If the consumer app is meant to be oblivious of the process, you will have to make a Base activity & Base application, load Catalyst, pass your bundle to the reactInstance, load it up, and also create a JVM (kotlin/java) API exposing a singleton or something similar, which sends the commands using an Emitter. And this is just android. iOs will have a similar path, but with the added complexities of integrating your SDK via xCode.

I would recommend you, having gone through this, to save yourself the trouble and try with kotlin multiplatform instead. Is designed for this sort of scenario, android works out of the box, and integrating object C frameworks with xCode is far easier, and does not force the consumer to do anything strange. And will work far better, for free.

Fco P.
  • 2,486
  • 17
  • 20
  • 1
    I'm not sure why this was downvoted. In a similar situation from the iOS side and my research has yielded similar results. Thanks for the thorough write-up and explanation. – Tyler Poland May 12 '21 at 23:38