[RNE Rewrite] Integrate resource fetcher (react-native-blob-util)

apps/computer-vision/package.json

@@ -37,6 +37,7 @@
     "expo-router": "~56.2.9",
     "react": "19.2.3",
     "react-native": "0.85.3",
+    "react-native-blob-util": "^0.24.0",
     "react-native-drawer-layout": "^4.2.2",
     "react-native-executorch": "workspace:*",
     "react-native-gesture-handler": "~2.31.1",

apps/nlp/package.json

@@ -27,6 +27,7 @@
     "expo-router": "~56.2.9",
     "react": "19.2.3",
     "react-native": "0.85.3",
+    "react-native-blob-util": "^0.24.0",
     "react-native-drawer-layout": "^4.2.2",
     "react-native-executorch": "workspace:*",
     "react-native-gesture-handler": "~2.31.1",

apps/speech/package.json

@@ -27,6 +27,7 @@
     "react": "19.2.3",
     "react-native": "0.85.3",
     "react-native-audio-api": "0.13.1",
+    "react-native-blob-util": "^0.24.0",
     "react-native-device-info": "^15.0.2",
     "react-native-drawer-layout": "^4.2.2",
     "react-native-executorch": "workspace:*",

packages/react-native-executorch/package.json

@@ -85,7 +85,7 @@
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "react-native-fs": "^2.20.0",
+    "react-native-blob-util": "^0.24.0",
     "react-native-worklets": "*"
   },
   "devDependencies": {
@@ -96,8 +96,8 @@
     "del-cli": "^6.0.0",
     "react": "19.2.0",
     "react-native": "0.83.6",
+    "react-native-blob-util": "^0.24.0",
     "react-native-builder-bob": "^0.40.18",
-    "react-native-fs": "^2.20.0",
     "react-native-worklets": "0.9.1",
     "typescript": "~5.9.2"
   },

packages/react-native-executorch/src/extensions/cv/tasks/classification.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import { softmax } from '../../math';
 import type { ImageBuffer } from '../image';
@@ -75,7 +76,7 @@ export async function createClassifier<L>(
   classifyWorklet: (input: ImageBuffer, options?: { topk?: number }) => Classification<L>[];
 }> {
   const { modelPath, classifierOpts } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
 
   const meta = validateModelSchema(
     model,

packages/react-native-executorch/src/extensions/cv/tasks/imageEmbedding.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import type { ImageBuffer } from '../image';
 import { createImagePreprocessor, type ImagePreprocessorOptions } from './preprocessing';
@@ -54,7 +55,7 @@ export async function createImageEmbedder(
   embedWorklet: (input: ImageBuffer) => Float32Array;
 }> {
   const { modelPath, opts } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
 
   const meta = validateModelSchema(
     model,

packages/react-native-executorch/src/extensions/cv/tasks/instanceSegmentation.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import type { ImageBuffer } from '../image';
 import { createImagePreprocessor, type ImagePreprocessorOptions } from './preprocessing';
@@ -114,7 +115,7 @@ export async function createInstanceSegmenter<F extends BoxFormat, L>(
   ) => InstanceSegmentationResult<F, L>[];
 }> {
   const { modelPath, opts } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
   const meta = validateModelSchema(
     model,
     'forward',

packages/react-native-executorch/src/extensions/cv/tasks/keypointDetection.ts

@@ -4,6 +4,7 @@ import { tensor, type Tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import type { ImageBuffer } from '../image';
 import { createImagePreprocessor, type ImagePreprocessorOptions } from './preprocessing';
@@ -180,7 +181,7 @@ export async function createKeypointDetector<F extends BoxFormat, L extends Prop
 }> {
   const { modelPath, opts } = config;
   const { landmarks } = opts;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
   const meta = validateModelSchema(
     model,
     'forward',

packages/react-native-executorch/src/extensions/cv/tasks/objectDetection.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import type { ResizeMode } from '../ops/image';
 import type { ImageBuffer } from '../image';
@@ -94,7 +95,7 @@ export async function createObjectDetector<F extends BoxFormat, L>(
   ) => ObjectDetection<F, L>[];
 }> {
   const { modelPath, opts } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
 
   const meta = validateModelSchema(
     model,

packages/react-native-executorch/src/extensions/cv/tasks/sdxsTextToImage.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 import { randomNormal } from '../../math';
 import { loadTokenizer } from '../../nlp/tokenizer';
 
@@ -76,8 +77,9 @@ export async function createSdxsTextToImage(
   generateWorklet: (prompt: string, seed?: number) => ImageBuffer;
 }> {
   const { modelPath, tokenizerPath } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
-  const tokenizer = await wrapAsync(loadTokenizer, runtime)(tokenizerPath);
+  const [localModelPath, localTokenizerPath] = await download([modelPath, tokenizerPath]);
+  const model = await wrapAsync(loadModel, runtime)(localModelPath);
+  const tokenizer = await wrapAsync(loadTokenizer, runtime)(localTokenizerPath);
 
   validateModelSchema(
     model,

packages/react-native-executorch/src/extensions/cv/tasks/semanticSegmentation.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import type { ImageBuffer } from '../image';
 import { createImagePreprocessor, type ImagePreprocessorOptions } from './preprocessing';
@@ -119,7 +120,7 @@ export async function createSemanticSegmenter<L extends PropertyKey = string>(
   ) => SemanticSegmentationResult<L>;
 }> {
   const { modelPath, opts } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
 
   const meta = validateModelSchema(
     model,

packages/react-native-executorch/src/extensions/cv/tasks/styleTransfer.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import type { ImageBuffer } from '../image';
 import { createImagePreprocessor, type ImagePreprocessorOptions } from './preprocessing';
@@ -67,7 +68,7 @@ export async function createStyleTransfer(
   transferStyleWorklet: (input: ImageBuffer) => ImageBuffer;
 }> {
   const { modelPath, opts } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
 
   const meta = validateModelSchema(
     model,

packages/react-native-executorch/src/extensions/nlp/tasks/textEmbedding.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import { loadTokenizer } from '../tokenizer';
 
@@ -60,9 +61,10 @@ export async function createTextEmbedder(
   embedWorklet: (input: string, prompt?: string) => Float32Array;
 }> {
   const { modelPath, tokenizerPath, defaultPrompt } = config;
+  const [localModelPath, localTokenizerPath] = await download([modelPath, tokenizerPath]);
   const [model, tokenizer] = await Promise.all([
-    wrapAsync(loadModel, runtime)(modelPath),
-    wrapAsync(loadTokenizer, runtime)(tokenizerPath),
+    wrapAsync(loadModel, runtime)(localModelPath),
+    wrapAsync(loadTokenizer, runtime)(localTokenizerPath),
   ]);
 
   // Text embedding models take two int64 inputs: the token ids and the

packages/react-native-executorch/src/extensions/nlp/tasks/tokenization.ts

@@ -1,19 +1,21 @@
 import type { WorkletRuntime } from 'react-native-worklets';
 
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 import { loadTokenizer } from '../tokenizer';
 
 /**
  * Loads a tokenizer and exposes its operations with lifetime management for the
  * `useTokenizer` hook.
  * @category Typescript API
- * @param tokenizerPath Absolute local path to a `tokenizer.json` file.
+ * @param tokenizerPath Remote URL or local path to a `tokenizer.json` file.
+ * Remote URLs are downloaded and cached automatically.
  * @param runtime Optional worklet runtime thread to run the tokenizer on.
  * @returns A promise resolving to the tokenizer operations and a `dispose`
  * handle that releases the native tokenizer.
  */
 export async function createTokenizer(tokenizerPath: string, runtime?: WorkletRuntime) {
-  const tokenizer = await wrapAsync(loadTokenizer, runtime)(tokenizerPath);
+  const tokenizer = await wrapAsync(loadTokenizer, runtime)(await download(tokenizerPath));
   const dispose = () => tokenizer.dispose();
 
   return {

packages/react-native-executorch/src/extensions/speech/tasks/fsmnVoiceActivityDetection.ts

@@ -4,6 +4,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 import { extractFrames } from '../utils/vadUtils';
 
 /**
@@ -216,7 +217,7 @@ export async function createFsmnVoiceActivityDetector(
 }> {
   const { modelPath, defaultOptions } = config;
 
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
+  const model = await wrapAsync(loadModel, runtime)(await download(modelPath));
 
   // Input is [frames, fftLength] with a dynamic frame count; the output is
   // [1, frames, classes] where class 0 is the non-speech class. The output frame

packages/react-native-executorch/src/extensions/speech/tasks/whisperSpeechToText.ts

@@ -5,6 +5,7 @@ import { tensor } from '../../../core/tensor';
 import { loadModel } from '../../../core/model';
 import { validateModelSchema, SymbolicTensor } from '../../../core/modelSchema';
 import { wrapAsync } from '../../../core/runtime';
+import { download } from '../../../fetcher';
 
 import { argmax } from '../../../extensions/math';
 import { loadTokenizer } from '../../nlp/tokenizer';
@@ -159,8 +160,9 @@ export async function createWhisperSpeechToText<L extends WhisperLanguage = Whis
   streamInsert: (audioChunk: Float32Array) => void;
 }> {
   const { modelPath, tokenizerPath, supportedLanguages, vadModel } = config;
-  const model = await wrapAsync(loadModel, runtime)(modelPath);
-  const tokenizer = await wrapAsync(loadTokenizer, runtime)(tokenizerPath);
+  const [localModelPath, localTokenizerPath] = await download([modelPath, tokenizerPath]);
+  const model = await wrapAsync(loadModel, runtime)(localModelPath);
+  const tokenizer = await wrapAsync(loadTokenizer, runtime)(localTokenizerPath);
   const voiceDetector = await createFsmnVoiceActivityDetector(vadModel, runtime);
 
   const eotToken = tokenizer.tokenToId('<|endoftext|>')!;