React NativeでのオンデバイスAI構築から得られる実践的な教訓

✍️ OpenClawRadar📅 公開日: February 25, 2026🔗 Source
React NativeでのオンデバイスAI構築から得られる実践的な教訓
Ad

LLMによるテキスト生成

React NativeでGGUFモデルを実行するにはllama.rnを使用します。これはllama.cppをラップし、Android(JNI)とiOS(Metal)向けのネイティブバインディングを提供します。コールバックによるトークンのストリーミングは良好に機能します。

メモリ管理が重要です:7B Q4モデルは実行時に約5.5GBのRAMを必要とします(ファイルサイズ×1.5でKVキャッシュと活性化のため)。デバイスRAMの60%を厳格な予算として使用し、50%で警告、60%でブロックしてOSによるアプリ強制終了を防ぎます。

GPUアクセラレーションはAndroidではOpenCL(Adreno GPU)、iOSではMetalを使用します。AndroidではGPUレイヤー>0でFlash Attentionがクラッシュするため、コードでこれを強制します。ほとんどのデバイスでは、GPUよりもKVキャッシュの量子化(f16/q8_0/q4_0)が効果的です。テストではf16からq4_0にすることで推論速度が約3倍になりました。

Stable Diffusionによる画像生成

これはプラットフォーム固有であり、両方をカバーする単一ライブラリはありません。

  • Android: MNN(Alibabaのフレームワーク、CPU、すべてのARM64デバイスで動作)とQNN(Qualcomm AI Engine、NPUアクセラレーション、Snapdragon 8 Gen 1+のみ)を使用します。QNNは3倍高速ですが、最近のQualcommチップでのみ動作します。自動フォールバック付きのランタイム検出を実装します。
  • iOS: Appleのml-stable-diffusionパイプラインをCore MLとNeural Engineアクセラレーションで使用します。パレット化モデル(約1GB、6ビット)はメモリ制約のあるデバイスに最適です。フル精度(約4GB、fp16)はANEで高速ですが、余裕が必要です。

実世界のベンチマーク:512×512、20ステップで、Snapdragon NPUで5〜10秒、フラッグシップCPUで15秒、iOS ANEで8〜15秒。ユーザーがアプリがフリーズしたと誤解しないよう、N回のノイズ除去ステップごとにリアルタイムプレビューを表示します。

Ad

Whisperによる音声文字起こし

whisper.rnはwhisper.cppをラップし、統合が簡単です。複数のモデルサイズ(Tiny/Base/Small)を提供し、ユーザーが速度と精度のトレードオフを選択できるようにします。リアルタイムの部分文字起こし(話しながら単語が表示される)でネイティブな感覚を実現します。

ネイティブコードでオーディオをバッファリングし、文字起こし後にクリアします。プライバシーが重要な場合はオーディオファイルをディスクに書き込まないでください。

マルチモーダルモデルによるビジョン

ビジョンモデルには2つのファイルが必要です:メインのGGUFとmmproj(マルチモーダルプロジェクター)コンパニオンです。これを透過的に処理します:ビジョンモデルを自動検出し、mmprojを自動ダウンロードし、単一ユニットとして追跡し、リンクが切れた場合はランタイムでモデルディレクトリを検索します。2Bビジョンモデルでは、両方のファイルを並列ダウンロードすることでダウンロード時間をほぼ半減できます。

500MのSmolVLMはモバイル向けの最適な選択肢で、フラッグシップデバイスで約7秒、文書読み取りやシーン記述に十分な能力があります。

オンデバイスエージェントループのためのツール呼び出し

関数呼び出しをサポートするモデルは、自動ループを通じてツール(ウェブ検索、電卓、日付/時刻、デバイス情報)を使用できます:LLMが生成、ツール呼び出しを解析、実行、結果をコンテキストに戻して注入、LLMが継続。無限ループを防ぐため、最大3回の反復、合計5回の呼び出しに制限します。

2つの解析パスをサポートします:大規模モデルはllama.rnを通じて構造化されたJSONツール呼び出しをネイティブに出力し、小規模モデルは<tool_call>のようなXMLを出力します。モデル読み込み時にjinjaチャットテンプレートを検査してツールサポートを検出します。モデルがツールをサポートしない場合、幻覚を避けるためにシステムプロンプトにツール定義を注入しません。電卓は再帰下降パーサーを使用します—eval()は絶対に使用しません。

意図分類

アプリがテキストと画像生成の両方を行う場合、入力分析に基づいてユーザーの意図を決定する必要があります。

📖 全文を読む: r/LocalLLaMA

Ad

👀 See Also

Claude APIのレート制限:タイムゾーンウィンドウ、コンテキスト管理、MCPオーバーヘッド
Guides

Claude APIのレート制限:タイムゾーンウィンドウ、コンテキスト管理、MCPオーバーヘッド

Claude APIのレート制限分析によると、ピーク時間帯(太平洋時間5時~11時/東部時間8時~14時の平日)により厳しい制限が課され、コンテキスト管理とMCPサーバーの使用がトークン消費に大きく影響することが明らかになりました。実用的な戦略としては、ピーク時間外での作業、新しいタスクごとに会話を新規開始、MCP統合の監査などが挙げられます。

OpenClawRadar
Opus 4.7 でプロンプトの40%が破損、修正方法は CLAUDE.md とスキルの構造化
Guides

Opus 4.7 でプロンプトの40%が破損、修正方法は CLAUDE.md とスキルの構造化

Opus 4.7が6つの環境でプロンプトの約40%を劣化させた後、AIのフラクショナルヘッドがアドホックなプロンプトを構造化されたSkillファイル、階層的なCLAUDE.md、個別のメモリファイルに置き換えることで修正し、トークン使用量を22%削減し、反復ターンを3-4から1-2に減らしました。

OpenClawRadar
フロントエンド最適化のためのClaude Code:88 PSIから100 PSIへ
Guides

フロントエンド最適化のためのClaude Code:88 PSIから100 PSIへ

ある開発者がClaude Codeを使用して、PageSpeed Insightsのモバイルスコアを88から100に引き上げた。主な戦術は、srcsetによるレスポンシブ画像、IntersectionObserver、フォントのプリロード除去。Claudeはワンプロンプトで修正するのではなく、デバッグパートナーとして機能した。

OpenClawRadar
MacBook ProでのLocal HomebrewとNVMを使用したOpenClawのインストール
Guides

MacBook ProでのLocal HomebrewとNVMを使用したOpenClawのインストール

ある開発者が、非管理者ユーザーアカウントでMacBook ProにOpenClawを正常にインストールした過程を記録し、その手順ではGeminiのガイダンスを活用しました。

OpenClawRadar