Code Modeとは何か
2026/4/4
序論：ツール呼び出しからCode Modeへ
初期のLLMは、外部システムとの連携に「Function Calling」を使っていました。事前定義されたAPIのJSONスキーマを一つずつ呼び出す手法です。しかしエージェントが複雑化するにつれ、レイテンシの増大・トークン枯渇・推論精度の低下という限界が露呈しました。
この壁を打破するのが 「Code Mode」 です。LLMは数百万行の実世界のソースコードを学習しており、自然言語によるツール選択推論よりも、プログラミング言語でのロジック記述のほうが遥かに得意です。この特性を活かし、個別のツール呼び出しではなく実行可能なコードそのものを書かせ、セキュアな環境で実行するのがCode Modeのアーキテクチャになります。
本記事では、TanStack AI PR #362の実装詳細とCloudflareのインフラを解説します。さらに、AnthropicのClaudeエコシステムにおけるCode Modeの多層的展開を深掘りしていきます。
TanStack AIにおけるCode Mode実装
TanStack AIは、特定のAIプロバイダーに依存しない型安全なAI SDKです。2026年にマージされたPR #362（240ファイル、+38,897行）により、Code Modeが正式に実装されました。
Cloudflareの哲学：「AIにはコードを書かせるべき」
原動力となったのはCloudflareの @cloudflare/codemode パッケージです。従来、エージェントは数百のツール定義をすべてコンテキストに読み込む必要がありました。Code ModeはこれをTypeScript型定義に変換し、LLMに「コードを書く」という単一のツールのみを提示します。結果、トークン消費を最大81%削減しています。
PR #362が導入したパッケージ群
PR #362は5つの新パッケージをTanStack AIエコシステムに追加しています。
| パッケージ | 役割 |
|---|---|
@tanstack/ai-code-mode | コアライブラリ。createCodeMode() でツール→型スタブ変換と execute_typescript ツール生成 |
@tanstack/ai-isolate-node | Node.js用V8 Isolateドライバ（isolated-vm C++アドオン） |
@tanstack/ai-isolate-quickjs | QuickJS WASMドライバ。ブラウザ・エッジ対応、ネイティブ依存なし |
@tanstack/ai-isolate-cloudflare | Cloudflare Workersドライバ。エッジ実行 |
createCodeMode() の仕組み
Code Modeの中核は createCodeMode() 関数です。開発者がツールを渡すと、2つのものを返します。
import { createCodeMode } from "@tanstack/ai-code-mode";
import { createNodeIsolateDriver } from "@tanstack/ai-isolate-node";
const { tool, systemPrompt } = createCodeMode({
driver: createNodeIsolateDriver(),
tools: [fetchWeather, searchRepos, getNpmStats],
timeout: 30_000,
});tool: LLMに提示する単一のexecute_typescriptツールsystemPrompt: 全ツールのTypeScript型スタブ（external_fetchWeather(...)等の関数シグネチャ）
LLMはこの型情報を頼りに、複数ツールをオーケストレーションするコードを生成します。
// LLMが生成するコードの例
const cities = ["Tokyo", "Paris", "New York"];
const results = await Promise.all(cities.map((city) => external_fetchWeather({ location: city })));
const warmest = results.reduce((prev, curr) => (curr.temperature > prev.temperature ? curr : prev));
return { comparison: results, warmest };3つのAPI呼び出しがサンドボックス内で並列実行され、LLMには構造化された最終結果のみが返ります。従来のTool Callingでは3回のラウンドトリップが必要でした。
実行パイプライン
chat() 関数に tool と systemPrompt を渡すだけで統合は完了します。LLMが execute_typescript を呼び出すと、生成コードはIsolateドライバに渡され、サンドボックス内で実行されます。コード内の external_* 関数呼び出しはIsolate境界を越えてホストプロセスに戻り、実際のツール実装が実行されます。
3種のIsolateドライバ
実行環境は用途に応じて選択できます。ドライバは共通の IsolateDriver インターフェースを実装しているため、コードの変更なしに切り替え可能です。
| ドライバ | 実行方式 | 最適な用途 | ブラウザ対応 |
|---|---|---|---|
Node (isolated-vm) | V8 JIT。最速 | サーバーサイドNode.jsアプリ | 不可 |
| QuickJS (WASM) | インタプリタ。低速だが依存なし | ブラウザ、エッジ、ポータビリティ重視 | 可能 |
| Cloudflare Workers | エッジV8。HTTP経由でWorkerに委譲 | Cloudflareへのエッジデプロイ | N/A |
Nodeドライバでは各 execute_typescript 呼び出しごとにフレッシュなV8 Isolateが生成され、実行後に破棄されます。QuickJS WASMドライバはasyncifyモデルを使用し、external_* 呼び出し中にWASMモジュールを一時停止できます。
Self-healing：コードの自己修復
LLMが生成したコードは実行前にTypeScriptの型定義でコンパイルチェックされます。エラーが検出されるとコンパイラのフィードバックがLLMに返され、LLMはそれをもとにコードを書き直します。このループにより、型の不一致やAPI呼び出しの誤りが実行前に自動修復されます。
動的UI生成
Code Modeは単にJSONを返すだけではありません。PR #362にはChart, DataTable, Sparkline等のUIコンポーネント群と external_report_* 関数を含んでいます。取得データからインタラクティブなダッシュボードをリアルタイムに生成可能です。既存アプリへの動的な機能拡張にも対応しています。PR内の銀行デモでは、LLMが「送金ボタン」をUIに動的に追加し、押下時のTypeScriptロジックまで生成しています。
Generative UIとの関係
Generative UIはAIがUIをどう生成・制御するかの表示パターンです。事前定義コンポーネントへのデータ注入から、構造化JSON記述、完全なHTML/SVG生成まで、制御度に応じた幅広いアプローチが存在します。一方 Code Mode はAIがコードを書いて複雑なタスクを実行する実行アーキテクチャです。両者は異なるレイヤーの概念であり、組み合わせて使えます。Code Modeの実行結果をGenerative UIで表示する、といった連携が可能です。
Agent Tool Protocol (ATP)
ATPの思想はCode Modeと共鳴しています。従来のOpenAPI仕様は人間の開発者向けで、50以上の不要フィールドを返すエンドポイントも珍しくありません。Code Modeでは、LLM自身が「200件取得→フィルタリング→整形」をコード内に記述し、洗練された結果のみをコンテキストに返します。
Claude「Code Mode」の4つのレイヤー
「ClaudeにもCode Modeはあるのか？」——答えはYesです。ただし、Anthropicのエコシステムでは「Code Mode」がレイヤーごとにまったく異なる意味を持っています。
Layer 1 — API：Code Execution Tool
Anthropicが提供する最も強力な機能です。ツール定義 code_execution_20250825 を含めると、Claudeはセキュアなサンドボックス内でPython/Bashを実行できます。
- REPL状態の永続化: 環境変数や作業ディレクトリが最大30日間維持されます（ゼロデータ保持ポリシー適用時を除く）
- 価格: 1,550時間の無料枠があり、Web検索ツールとの併用時はコード実行が無料です
- Cloudflareの哲学と完全に一致しています——LLMにツール呼び出しではなくコード実行をさせる
前章で紹介したTanStack AIのCode Modeは、このLayer 1に相当します。実行環境はCloudflareのV8 Isolate（TypeScript）とAnthropicのサンドボックスコンテナ（Python/Bash）で異なります。しかし「LLMにコードを書かせてセキュアな環境で実行する」というコアの設計思想は同一です。
Layer 2 — Desktop：Chat / Cowork / Code
| モード | 対象 | 権限 | 主な機能 |
|---|---|---|---|
| Chat | 一般ユーザー | ファイルアクセスなし | 質疑応答、文章作成 |
| Cowork | ナレッジワーカー | 承認済みファイル + SaaS連携 | MCP経由のファイル管理、データ分析 |
| Code | 開発者 | コードベース全体 + シェル | コード記述、Git操作、テスト、サブエージェント |
Layer 3 — CLI：Plan Mode → Code Mode
いきなり大規模改修を依頼すると、コンテキストを見失い無駄な修正を繰り返す「デバッグループ」に陥ります。これを防ぐため、Claude Codeでは以下のフローを推奨しています。
- Plan Mode でコードベースを探索・依存関係を分析・設計図を提示
- ユーザーがレビュー・承認（Human-in-the-loop）
- Code Mode に移行し、
str_replaceやシェルコマンドで実際にコードを適用
Layer 4 — Artifacts UI：表示トグル
Artifactsウィンドウの「Preview / Code」切替スイッチです。生成コードのソース表示ビューであり、自律的なコード実行環境ではない点に注意が必要です。
モバイル環境への展開
2025年10月、AnthropicはClaude iOSアプリ内でのClaude Code利用を解禁しました。2026年にはAndroidを含むクロスプラットフォーム対応へと進化しています。
| 手法 | メリット | 制約 | 最適な用途 |
|---|---|---|---|
| 公式Claude App | OAuth連携のみで動作。環境構築不要 | クラウド実行に限定 | PRレビュー、軽量タスクの指示 |
| SSH + Tailscale | ローカルPCの完全なターミナル制御 | ホストPCの常時起動が必要 | メインマシンのフル操作 |
| Termux (Android) | 外部サーバー不要でローカル実験可能 | iOS非対応、パフォーマンス限界 | モバイル完結の実験 |
| Sealos DevBox | クリーンな環境を即時構築・共有可能 | 外部プラットフォームへの依存 | 共有ワークスペース |
公式アプリでは「Code」タブからOAuth認証でリポジトリへのアクセスを許可するだけで、移動中でもAIエージェントへの指示やPR作成が可能です。
MCP連携：動的ツール探索とデータ保護
Tool Search と Lazy Loading
初期のMCPでは数百のツール定義をすべてプロンプトに事前ロードしていました。トークンの浪費に加え、不適切なツールを呼び出す Tool Poisoning のリスクもありました。
2026年、Anthropicはこれを解決する Tool Search Tool をGA化しました。エージェントはオンデマンドでツールカタログを検索し、遅延読み込みを行います。さらに、見つけたツールをCode Execution内からプログラム的に呼び出します。ループ・エラーハンドリング・データ変換はすべてコードとして明示的に記述されます。
PIIデータのトークン化
Code ModeとMCPの組み合わせがもたらすもう一つの決定的な利点が、データの局所化です。
エージェントはデータ同期のスクリプトを書き、実行環境に引き渡します。MCPクライアントがデータをインターセプトし、[EMAIL_1]、[PHONE_1] にトークン化します。LLMは匿名データのみを扱い、出力時にMCPクライアント内で元データに復元します。実データがモデル内部を通過することはありません。
Claude Codeの自律化（2026 Q1）
ヘッドレスエージェントへの進化
Claude Codeは単なるローカルツールを超え、バックグラウンドで永続稼働するヘッドレスエージェントへと進化しました。
- Remote Control: サーバー上のClaude Codeプロセスに、API/Webhookで直接タスクを指示できます
- One-way Channels: 外部アラート（Cal.comの予約等）を転送し、自律的にタスクを実行します
- Two-way Channels: Telegramからテキストを送るだけで、バグ修正やデプロイを実行できます
Auto Modeと安全メカニズム
長時間タスクを人間の介入なしで完遂する Auto Mode は、強力な分だけ厳格な制約を持っています。
デフォルト許可（非破壊的操作）:
- ファイル読み取り、パターン検索、コードナビゲーション、Plan Mode移行
Auto Mode時に除外される権限:
- シェルの無制限アクセス、スクリプトインタープリタのワイルドカード実行、パッケージマネージャーの実行
ブロックされる具体例:
- 「古いブランチを整理して」→ リモートブランチの大量削除は不可逆的すぎてブロックされます
- 認証エラー →
.envを探索してトークンを探す行為は権限逸脱でブロックされます - デバッグ用にコードをGistにアップロード → データ流出としてブロックされます
セキュリティと重大インシデント
モデルの自律的攻撃能力（ASL評価）
CMU CyLabとの共同評価で、最新Claudeモデルはサンドボックス内のBash/Kali Linux環境と標準OSSツールのみで、多段階の標的型攻撃を成功させました。特筆すべきは、既存エクスプロイトの実行ではなく、OGNLインジェクションのペイロードをゼロから構築し、TomcatでのRCEを達成した点です。
この能力向上は、モデルをASL-2からより厳格なASL-3へ引き上げる決定的要因となっています。
2026年3月 ソースコード流出インシデント
2026年3月31日、npmの定期アップデートで約60MBのソースマップがClaude Codeパッケージに意図せず含まれました。ソースマップとは、ミニファイされたJSを元のTypeScriptソースツリーに完全復元できるアーティファクトです。
セキュリティ研究者Chaofan Shou氏がUTC 8:23に発見・報告しました。投稿は2,800万回閲覧され、数時間後にはGitHub上のミラーリポジトリが8万4千スター、8万2千フォークを獲得しています。
原因は、Anthropicが2025年末に買収したBunの重大バグでした。プロダクションビルドでソースマップが強制出力されるバグ（Issue #28001、3月11日報告）が20日間放置された結果、自社ツールチェーンの不具合で自社プロダクトのソースを流出させてしまいました。
流出した51万2千行・約2,000ファイルの分析で、Claude Codeの高度な内部構造が明らかになりました。
- UI層: ink等のカスタムターミナルレンダリング
- コマンド層: Commander.jsによるCLIサブコマンド制御
- エージェント層: マルチエージェント協調、タスクキュー、サブエージェント動的生成
- ツール層: ファイルI/O、Bash実行、Web検索、MCP統合
- インフラ層: API呼び出し、トークンコンパクション、OAuth、テレメトリ
最も衝撃的だったのは、この巨大なアーキテクチャの大部分がAI自身のコード生成で構築されていたという事実です。
結論：Code Modeがもたらす開発パラダイムの終着点
TanStack AIとClaudeエコシステムの「Code Mode」は、レイヤーごとに異なる役割を担いながらも、一つの哲学で貫かれています。
「AIの真の力は、用意されたボタン（ツール）を押すことではなく、自らツールを創り出し、繋ぎ合わせるためのコードを記述し、実行することにある」
- TanStack AI + Cloudflare: V8 Isolateで生成コードをミリ秒単位で安全に実行
- Anthropic: MCPの動的探索 + プログラム的呼び出しで、トークン枯渇と機密データ漏洩を同時に防止
- CLI/Desktop: Plan ↔ Code Modeの分離でエージェントの暴走を抑制
ソースコード流出やASL評価が示すように、自律型コード実行エージェントはすでに人間と同等以上の構築能力と破壊能力を持っています。Code Modeは単なる一機能ではなく、ソフトウェア開発の主役が「コードを書く人間」から「コードを書くAIをオーケストレーションする人間」へ移行する、その転換点を象徴するアーキテクチャです。