diff --git a/js/README.md b/js/README.md index 9f1a6150a7..b6f5eb84cc 100644 --- a/js/README.md +++ b/js/README.md @@ -339,7 +339,11 @@ This project provides an ONNX Runtime React Native JavaScript library to run ONN ### Models with ORT format -By default, ONNX Runtime React Native leverages ONNX Runtime Mobile package with ORT format. Follow the [instruciton](https://onnxruntime.ai/docs/tutorials/mobile/model-conversion.html) to covert ONNX model to ORT format. +Prior to ORT v1.13, the ONNX Runtime React Native package utilized the ONNX Runtime Mobile package, which required an ONNX model to be converted to ORT format. +Follow these [instructions](https://onnxruntime.ai/docs/reference/ort-format-models.html#convert-onnx-models-to-ort-format) to convert ONNX model to ORT format. +Note that the ONNX Runtime Mobile package includes a reduced set of operators and types, so not all models are supported. See [here](https://onnxruntime.ai/docs/reference/operators/MobileOps.html) for the list of supported operators and types. + +From ORT v1.13 onwards the 'full' ONNX Runtime package is used. It supports both ONNX and ORT format models, and all operators and types. ### Build @@ -349,21 +353,38 @@ By default, ONNX Runtime React Native leverages ONNX Runtime Mobile package with - in `/js/common/`, run `npm ci`. - in `/js/react_native/`, run `yarn`. -2. Build Android ONNX Runtime package +2. Acquire or build the Android ONNX Runtime package 1. To use a published Android ONNX Runtime Mobile package from Maven, go to step 5. - 2. Set up an Android build environment referring to [instruction](https://www.onnxruntime.ai/docs/how-to/build/android-ios.html#android) + 2. Set up an Android build environment using these [instructions](https://onnxruntime.ai/docs/build/android.html). Note that the dependencies are quite convoluted, so using the specified JDK and Gradle versions is important. - 3. In ``, run this python script to build ONNX Runtime Android archive file. In windows, this requires an admin account to build. To build a model specific package with reduced size, refer to [instruction](https://www.onnxruntime.ai/docs/how-to/build/reduced.html#build-ort-with-reduced-size). + 3. In ``, run the below python script to build the ONNX Runtime Android archive file. On a Windows machine, this requires an admin account to build. + You can build a 'full' package that supports all operators and types, or a reduced size 'mobile' package that supports a limited set of operators and types based on your model/s to miminize the binary size. + See [here](https://onnxruntime.ai/docs/build/custom.html) for information about how the reduced build works, including creating the configuration file using your model/s. + + + Full build: ```sh - python tools/ci_build/github/android/build_aar_package.py tools/ci_build/github/android/default_mobile_aar_build_settings.json --config MinSizeRel --android_sdk_path --android_ndk_path --build_dir --include_ops_by_config tools/ci_build/github/android/mobile_package.required_operators.config + python tools/ci_build/github/android/build_aar_package.py tools/ci_build/github/android/default_full_aar_build_settings.json --config Release --android_sdk_path --android_ndk_path --build_dir ``` - 4. Copy `/aar_out/MinSizeRel/com/microsoft/onnxruntime/onnxruntime-mobile//onnxruntime-mobile-.aar` into `/js/react_native/android/libs` directory. + Reduced size build with configuration file generated from your model/s. Note that either Release or MinSizeRel could be used as the config, depending on your priorities: + ```sh + python tools/ci_build/github/android/build_aar_package.py tools/ci_build/github/android/default_mobile_aar_build_settings.json --config MinSizeRel --android_sdk_path --android_ndk_path --build_dir --include_ops_by_config --enable_reduced_operator_type_support + ``` - 5. To verify, open Android Emulator and run this command from `/js/react_native/android` + 4. Move the generated ONNX Runtime Android archive file to `/js/react_native/android/libs/`. + + Full build: + Copy `/aar_out/Release/com/microsoft/onnxruntime/onnxruntime-android//onnxruntime-android-.aar` into `/js/react_native/android/libs` directory. + + Reduced size build: + Copy `/aar_out/MinSizeRel/com/microsoft/onnxruntime/onnxruntime-mobile//onnxruntime-mobile-.aar` into `/js/react_native/android/libs` directory and update to dependencies in [js/react_native/android/build.gradle](https://github.com/microsoft/onnxruntime/blob/365a01397dbd1293e0c2773380c57fd271432b72/js/react_native/android/build.gradle#L136-L137) to use onnxruntime-mobile instead of onnxruntime-android. + + + 5. To verify, open the Android Emulator and run this command from `/js/react_native/android` ```sh ./gradlew connectedDebugAndroidTest @@ -371,23 +392,40 @@ By default, ONNX Runtime React Native leverages ONNX Runtime Mobile package with 3. Build iOS ONNX Runtime package - 1. To use a published c/c++ ONNX Runtime Mobile package from CocoaPods, skip all steps below. + 1. To use the published C/C++ ONNX Runtime package from CocoaPods, skip all steps below. - 2. Set up iOS build environment referring to [instruction](https://www.onnxruntime.ai/docs/how-to/build/android-ios.html#ios). + 2. Set up iOS build environment using these [instructions](https://onnxruntime.ai/docs/build/ios.html). - 3. Build a fat ONNX Runtime Mobile Framework for iOS and iOS simulator from `` using this command, + 3. Build a fat ONNX Runtime Mobile Framework for iOS and iOS simulator from `` using this command: + Full build: ```sh - python tools/ci_build/github/apple/build_ios_framework.py tools/ci_build/github/apple/default_mobile_ios_framework_build_settings.json --config MinSizeRel --include_ops_by_config tools/ci_build/github/android/mobile_package.required_operators.config + python tools/ci_build/github/apple/build_ios_framework.py tools/ci_build/github/apple/default_full_ios_framework_build_settings.json --config Release ``` - It creates `Headers`, `LICENSE`, and `onnxruntime.xcframework` in `build/iOS_framework/framework_out` directory. From `framework_out` directory, create an archive file named `onnxruntime-mobile-c.zip` as follows and copy to `/js/react_native/local_pods` directory. + Reduced size build: + ```sh + python tools/ci_build/github/apple/build_ios_framework.py tools/ci_build/github/apple/default_mobile_ios_framework_build_settings.json --config MinSizeRel --include_ops_by_config --enable_reduced_operator_type_support + ``` + The build creates `Headers`, `LICENSE`, and `onnxruntime.xcframework` in `build/iOS_framework/framework_out` directory. From `framework_out` directory, create an archive file named `onnxruntime-c.zip` for a full build or `onnxruntime-mobile-c.zip` for a reduced size build and copy to `/js/react_native/local_pods` directory. + + Full build: + ```sh + zip -r onnxruntime-c.zip . + ``` + + Reduced size build: ```sh zip -r onnxruntime-mobile-c.zip . ``` - 4. To verify, open iOS Simulator and run this command from `/js/react_native/ios`. Change a destination to specify a running iOS Simulator. + 4. To verify, open the iOS Simulator and run the below command from `/js/react_native/ios`. Change the destination argument as needed to specify a running iOS Simulator. + + If using the reduced size build it is necessary to first update some configuration to use the mobile ORT package: + - replace `onnxruntime/onnxruntime.framework` with `onnxruntime-mobile/onnxruntime.framework` in /js/react_native/ios/OnnxruntimeModule.xcodeproj/project.pbxproj + - replace `onnxruntime-c` with `onnxruntime-mobile-c` in /js/react_native/ios/Podfile + - For reference, [this PR](https://github.com/microsoft/onnxruntime/pull/13037) shows the changes made to switch from using the 'mobile' ORT package to the 'full' package. ```sh pod install @@ -408,7 +446,13 @@ By default, ONNX Runtime React Native leverages ONNX Runtime Mobile package with yarn bootstrap ``` - When testing with a custom built ONNX Runtime Android package, copy `/aar_out/MinSizeRel/com/microsoft/onnxruntime/onnxruntime-mobile//onnxruntime-mobile-.aar` into `/js/react_native/e2e/android/app/libs` directory. Using a custom built ONNX Runtime iOS package, copy `onnxruntime-mobile-c.zip` into `/js/react_native/local_pods` directory if it's not already done. + When testing with a custom built ONNX Runtime Android package, copy `/aar_out/MinSizeRel/com/microsoft/onnxruntime/onnxruntime-{android|mobile}//onnxruntime-{android|mobile}-.aar` into the `/js/react_native/e2e/android/app/libs` directory. + + When testing with a custom built ONNX Runtime iOS package, copy `onnxruntime-[mobile-]c.zip` into the `/js/react_native/local_pods` directory. + + If using the reduced size build it is necessary to update some configuration to use the mobile ORT package: + - replace `com.microsoft.onnxruntime:onnxruntime-android` with `com.microsoft.onnxruntime:onnxruntime-mobile` in /js/react_native/e2e/android/app/build.gradle + - replace `onnxruntime-c` with `onnxruntime-mobile-c` in /js/react_native/e2e/ios/Podfile From `/js/react_native/e2e/android`, run e2e Android tests as follows, @@ -433,7 +477,7 @@ By default, ONNX Runtime React Native leverages ONNX Runtime Mobile package with ### NPM Packaging -1. Update a version using `npm verison ` from `/js/react_native` folder. If it's for a dev, use `npm version -dev.` +1. Update a version using `npm version ` from `/js/react_native` folder. If it's for a dev, use `npm version -dev.` 2. Run `npm pack` and verify NPM package contents diff --git a/js/react_native/README.md b/js/react_native/README.md index d64d08484a..2f08356a84 100644 --- a/js/react_native/README.md +++ b/js/react_native/README.md @@ -1,6 +1,6 @@ # onnxruntime-react-native -ONNX Runtime React Native provides a JavaScript library for running ONNX models on React Native app. +ONNX Runtime React Native provides a JavaScript library for running ONNX models in a React Native app. ### Why ONNX models @@ -8,7 +8,7 @@ The [Open Neural Network Exchange](http://onnx.ai/) (ONNX) is an open standard f ### Why ONNX Runtime React Native -With ONNX Runtime React Native, React Native developers can score pre-trained ONNX models directy on React Native apps by leveraging [ONNX Runtime Mobile](https://www.onnxruntime.ai/docs/reference/mobile/prebuilt-package/), so it provides a light-weight inference solution for Android and iOS. +With ONNX Runtime React Native, React Native developers can score pre-trained ONNX models directly in React Native apps by leveraging [ONNX Runtime](https://onnxruntime.ai/docs/), so it provides a light-weight inference solution for Android and iOS. ### Installation @@ -27,14 +27,16 @@ const session: InferenceSession = await InferenceSession.create(modelPath); const result = session.run(input, ['num_detection:0', 'detection_classes:0']) ``` -Refer to [ONNX Runtime JavaScript examples](https://github.com/microsoft/onnxruntime-inference-examples/tree/main/js) for samples and tutorials. Different from other JavaScript frameworks like node.js and web, React Native library doesn't support these features. - -- Unsigned data type at Tensor +Refer to [ONNX Runtime JavaScript examples](https://github.com/microsoft/onnxruntime-inference-examples/tree/main/js) for samples and tutorials. The ONNX Runtime React Native library does not currently support the following features: +- Tensors with unsigned data types, with the exception of uint8 on Android devices - Model loading using ArrayBuffer ### Operator and type support -ONNX Runtime React Native currently supports most operators used by popular models. Refer to [ONNX Runtime Mobile Pacakge Operator and Type](https://www.onnxruntime.ai/docs/reference/mobile/prebuilt-package/1.8%20ORTMobilePackageOperatorTypeSupport). +ONNX Runtime React Native version 1.13 supports both ONNX and ORT format models, and includes all operators and types. + +Previous ONNX Runtime React Native packages use the ONNX Runtime Mobile package, and support operators and types used in popular mobile models. +See [here](https://onnxruntime.ai/docs/reference/operators/MobileOps.html) for the list of supported operators and types. ### License diff --git a/js/react_native/package.json b/js/react_native/package.json index 13c6b1eaa6..cc69c48dc7 100644 --- a/js/react_native/package.json +++ b/js/react_native/package.json @@ -40,7 +40,7 @@ "source": "lib/index", "version": "1.13.0", "main": "dist/commonjs/index", - "homepage": "https://github.com/Microsoft/onnxruntime/js/react_native#readme", + "homepage": "https://github.com/microsoft/onnxruntime/blob/main/js/react_native/README.md", "files": [ "lib", "dist", @@ -60,7 +60,7 @@ "!android/gradle/wrapper/*.jar", "!android/libs" ], - "description": "Onnxruntime bridge for react native", + "description": "ONNX Runtime bridge for react native", "repository": "https://github.com/Microsoft/onnxruntime.git", "react-native-builder-bob": { "source": "lib",