VSCode 上で動作する AI コーディングアシスタント「Cline」は、ファイル編集やターミナルコマンド実行など、強力な機能を備えています。しかし、その真価は「人間が常にコントロールできる」設計にあります。

本記事では、Cline の中核となる「実行キュー」「ツール権限管理」「差分適用」の 3 つのメカニズムに焦点を当て、それぞれの仕組みと連携について詳しく解説します。これらの仕組みを理解することで、Cline をより安全かつ効率的に活用できるようになるでしょう。

背景

Cline が採用する Human-in-the-Loop アーキテクチャ

AI コーディングアシスタントには、完全自動で作業を進めるものと、人間の承認を都度求めるものがあります。Cline は後者の「Human-in-the-Loop（人間参加型）」アプローチを採用しています。

このアプローチは、AI が提案したアクションを実行前に必ず人間がレビューできる仕組みです。セキュリティとコントロールを重視する開発者にとって、この設計は極めて重要な意味を持ちますね。

VSCode 拡張機能としての制約と利点

Cline は VSCode の拡張機能として動作するため、エディタのエクステンションホストプロセスとウェブビュープロセスの 2 つに分離されています。

• エクステンションホスト: ビジネスロジック、タスク実行、ファイルシステムアクセスを担当
• ウェブビュー: UI レンダリング、ユーザーインタラクションを担当

両者は gRPC ベースの通信レイヤーで接続されており、これにより UI の応答性を保ちながら、バックグラウンドで重い処理を実行できます。

以下の図は、Cline の基本アーキテクチャを示しています。

mermaidCopy codeflowchart TB
  user["開発者"] -->|"操作"| webview["Webview プロセス<br/>(UI レンダリング)"]
  webview <-->|"gRPC 通信"| exthost["エクステンションホスト<br/>(ビジネスロジック)"]
  exthost -->|"ファイル操作"| filesystem["ファイルシステム"]
  exthost -->|"ターミナル実行"| terminal["VSCode ターミナル"]
  exthost -->|"AI リクエスト"| ai["AI モデル<br/>(Claude など)"]

この図から、Cline が UI と処理を分離し、各コンポーネントが明確な役割を持つことが理解できます。

Model Context Protocol (MCP) による拡張性

Cline は Model Context Protocol (MCP) を通じて、外部ツールとの統合を実現しています。MCP は Anthropic が提唱する、AI エージェントとツール間の標準化されたプロトコルです。

開発者は MCP サーバーを作成することで、Cline の機能を自由に拡張できます。たとえば、Jira チケットの取得、AWS EC2 インスタンスの管理、データベースクエリの実行など、プロジェクト固有のワークフローに対応したツールを追加できるのです。

課題

AI の自律性と人間の制御のバランス

AI コーディングアシスタントを設計する上で最も難しい課題は、「どこまで AI に自律性を与え、どこで人間の判断を求めるか」というバランスです。

完全自動化は効率的に見えますが、予期しないコード変更やセキュリティリスクを招く恐れがあります。一方で、すべてのアクションに承認を求めると、開発者の作業が中断され、生産性が低下してしまいます。

Cline はこの課題に対し、「デフォルトで承認を求めつつ、信頼できる操作は自動承認できる」という柔軟な仕組みで対応しています。

複数ツールの同時実行と順序制御

Cline はファイル編集、ターミナルコマンド実行、ブラウザ操作など、多様なツールを扱います。これらのツールが同時に実行されると、競合状態やデータ不整合が発生する可能性があります。

たとえば、あるファイルを読み込んでいる最中に別のタスクがそのファイルを編集すると、読み込み内容が古くなってしまいますね。このような問題を防ぐため、タスクの実行順序を適切に管理する必要があります。

変更の可視化と追跡の難しさ

AI が提案した変更内容を、開発者がすぐに理解できる形で提示することも重要な課題です。単に「このファイルを変更します」と伝えるだけでは、どの部分がどう変わるのかが分かりません。

また、変更を適用した後に「やっぱり元に戻したい」と思った場合、簡単にロールバックできる仕組みも必要です。Cline は diff ビューと VSCode のタイムライン機能を活用して、この課題に対処しています。

以下の図は、Cline が直面する主な課題とその対応策を示しています。

mermaidCopy codeflowchart LR
  challenge1["AI の自律性 vs<br/>人間の制御"] -->|"対応策"| solution1["段階的な<br/>承認システム"]
  challenge2["複数ツールの<br/>同時実行"] -->|"対応策"| solution2["実行キュー<br/>による順序制御"]
  challenge3["変更の可視化<br/>と追跡"] -->|"対応策"| solution3["diff ビュー +<br/>タイムライン"]

解決策

実行キュー：タスクライフサイクルの管理

Cline の実行キューは、タスクを一貫したライフサイクルで管理することで、複数ツールの順序制御を実現しています。

タスクは以下の段階を経て実行されます。

mermaidCopy codestateDiagram-v2
  [*] --> init: initTask()
  init --> planning: AI がアプローチを策定
  planning --> approval: ユーザー承認待ち
  approval --> execution: 承認された場合
  approval --> rejected: 却下された場合
  execution --> completion: ツール実行完了
  rejected --> [*]
  completion --> [*]

この図から、各タスクが明確なステートマシンに従って進行することが分かります。

タスクの初期化

タスクは initTask() メソッドを通じて初期化されます。このメソッドは、タスクの ID、種類、パラメータなどを設定し、実行キューに登録します。

typescriptCopy code// タスク初期化の例
async initTask(taskType: string, params: any): Promise<string> {
  const taskId = generateUniqueId()
  const task = {
    id: taskId,
    type: taskType,
    params,
    status: 'initialized',
    createdAt: Date.now()
  }
  this.taskQueue.enqueue(task)
  return taskId
}

この初期化処理により、すべてのタスクが追跡可能になります。

AI によるプランニング

初期化されたタスクは、AI モデルに送られて実行計画が策定されます。AI は利用可能なツール、現在のプロジェクト状態、ユーザーの要求を考慮して、最適なアプローチを提案します。

typescriptCopy code// AI プランニングの例
async planTask(task: Task): Promise<ExecutionPlan> {
  const context = await this.gatherContext(task)
  const prompt = this.buildPlanningPrompt(task, context)
  const response = await this.aiModel.generate(prompt)
  return this.parsePlan(response)
}

このプランニング段階で、必要なツールの選択と実行順序が決定されます。

ユーザー承認ループ

プランが策定されると、Cline はユーザーに承認を求めます。このループは handleWebviewAskResponse メカニズムを通じて実装されています。

ユーザーは提案されたアクションを確認し、以下のいずれかの選択を行えます。

#	選択肢	説明
1	承認	提案通りにアクションを実行
2	却下	アクションを実行せず、別のアプローチを要求
3	編集	提案内容を修正してから実行

このループにより、開発者は常に最終決定権を保持できます。

ツール実行と完了

承認が得られたタスクは、対応するツールが実行されます。実行が完了すると、タスクのステータスが更新され、結果がユーザーに報告されます。

typescriptCopy code// ツール実行の例
async executeTask(task: Task, plan: ExecutionPlan): Promise<TaskResult> {
  task.status = 'executing'
  try {
    const result = await this.toolExecutor.run(plan)
    task.status = 'completed'
    return result
  } catch (error) {
    task.status = 'failed'
    throw error
  }
}

この実行フローにより、タスクの状態が常に追跡可能になります。

ツール権限管理：AutoApprove クラスによる制御

Cline のツール権限管理は、AutoApprove クラスを中心に構築されています。このクラスは、各ツールのアクションが自動承認されるべきか、ユーザー承認が必要かを判定します。

権限レベルの設定

Cline は複数の権限レベルをサポートしており、開発者はプロジェクトやツールごとに適切なレベルを設定できます。

#	権限レベル	説明	例
1	読み取り専用	ファイルの読み込みのみ許可	cat、ls コマンド
2	安全なコマンド	破壊的でないコマンドを許可	grep、find コマンド
3	ファイル編集	ファイルの作成・編集を許可	エディタでの変更
4	ターミナル実行	すべてのターミナルコマンドを許可	rm、npm install など

この段階的な権限設定により、リスクに応じた制御が可能になりますね。

Plan モードと Act モードの分離

Cline は「Plan モード」と「Act モード」を明確に分離しています。

• Plan モード: 完全に読み取り専用で、コードベースの分析、ファイルの読み込み、質問の投げかけ、実装戦略の提案のみを行います
• Act モード: 読み書きアクセスが有効になり、計画された解決策を実装できます

重要なのは、Cline が自動的に Act モードに切り替えることはできず、ユーザーの明示的な承認を待つ必要がある点です。この設計により、予期しない変更を防ぐことができます。

mermaidCopy codeflowchart LR
  user_request["ユーザーリクエスト"] --> plan_mode["Plan モード<br/>(読み取り専用)"]
  plan_mode -->|"分析・提案"| proposal["実装提案"]
  proposal -->|"ユーザー承認"| act_mode["Act モード<br/>(読み書き可能)"]
  proposal -->|"ユーザー却下"| plan_mode
  act_mode -->|"実装完了"| result["変更適用"]

この図から、モードの切り替えが常にユーザーの制御下にあることが分かります。

ツールタイプ別の承認判定

AutoApprove クラスは、ツールの種類、対象ファイルパス、ユーザー設定を考慮して承認判定を行います。

typescriptCopy code// AutoApprove クラスの判定ロジック例
class AutoApprove {
  shouldAutoApprove(
    toolType: string,
    filePath: string,
    userSettings: Settings
  ): boolean {
    // YOLO モード（すべて自動承認）の場合
    if (userSettings.yoloMode) {
      return true;
    }

    // ツールタイプによる判定
    if (
      toolType === 'read_file' &&
      userSettings.autoApproveRead
    ) {
      return true;
    }

    // ファイルパスによる判定（node_modules など）
    if (this.isSafePath(filePath)) {
      return true;
    }

    // デフォルトは承認が必要
    return false;
  }
}

このロジックにより、安全な操作は自動化しつつ、リスクのある操作は承認を求めることができます。

MCP ツールの権限管理

Model Context Protocol (MCP) を通じて統合された外部ツールも、同じ権限管理システムの対象となります。

mermaidCopy codeflowchart TB
  cline["Cline タスク"] --> mcphub["McpHub<br/>(接続マネージャー)"]

  subgraph tools["MCP ツール"]
    tool1["filesystem<br/>(ファイル操作)"]
    tool2["github<br/>(PR/Issue 管理)"]
    tool3["database<br/>(SQL クエリ)"]
    tool4["custom<br/>(ユーザー作成)"]
  end

  mcphub -->|"stdio/SSE"| tool1
  mcphub -->|"stdio/SSE"| tool2
  mcphub -->|"stdio/SSE"| tool3
  mcphub -->|"stdio/SSE"| tool4

  tool1 --> approval["承認チェック"]
  tool2 --> approval
  tool3 --> approval
  tool4 --> approval

  approval -->|"承認済み"| execute["実行"]
  approval -->|"承認待ち"| user_confirm["ユーザー確認"]

この図から、すべてのツールが統一された承認メカニズムを通過することが理解できます。

MCP ツールは、stdio または Server-Sent Events (SSE) トランスポートを通じて通信し、必要に応じて動的に新しい MCP サーバーを作成できます。

差分適用：Diff ビューとタイムライン機能

Cline の差分適用メカニズムは、VSCode のネイティブ機能を活用して、変更の可視化と制御を実現しています。

Diff ビューによる変更の可視化

Cline がファイルの変更を提案すると、VSCode の diff エディタが自動的に開きます。このエディタは、変更前と変更後のコードを並べて表示します。

typescriptCopy code// Diff ビューの表示例
async showDiffView(
  originalPath: string,
  modifiedContent: string
): Promise<void> {
  const originalUri = vscode.Uri.file(originalPath)
  const modifiedUri = vscode.Uri.file(`${originalPath}.cline-modified`)

  // 一時的な変更ファイルを作成
  await vscode.workspace.fs.writeFile(
    modifiedUri,
    Buffer.from(modifiedContent)
  )

  // Diff エディタを開く
  await vscode.commands.executeCommand(
    'vscode.diff',
    originalUri,
    modifiedUri,
    `Cline: ${path.basename(originalPath)}`
  )
}

このコードにより、変更内容が視覚的に分かりやすく表示されます。

ユーザーによる変更の編集

Diff ビューでは、単に変更を承認または却下するだけでなく、提案された変更を直接編集することもできます。

開発者は Cline の提案をベースにしつつ、必要に応じて細かい調整を加えられます。この柔軟性により、AI と人間の協働がよりスムーズになりますね。

VSCode タイムラインによる変更追跡

すべての変更は VSCode のタイムライン機能に記録されます。タイムラインは、ファイルの変更履歴を時系列で表示する機能で、各変更点にアクセスできます。

typescriptCopy code// タイムライン記録の例
async applyChanges(filePath: string, content: string): Promise<void> {
  // 変更を適用
  await vscode.workspace.fs.writeFile(
    vscode.Uri.file(filePath),
    Buffer.from(content)
  )

  // タイムラインに自動的に記録される（VSCode が処理）
  // ユーザーは後で「元に戻す」が可能
}

この仕組みにより、変更を適用した後でも、簡単にロールバックできます。

変更適用の全体フロー

差分適用の全体的な流れを以下の図で示します。

mermaidCopy codesequenceDiagram
  participant User as 開発者
  participant Cline as Cline
  participant Diff as Diff エディタ
  participant FS as ファイルシステム
  participant Timeline as タイムライン

  User->>Cline: ファイル変更をリクエスト
  Cline->>Cline: 変更内容を生成
  Cline->>User: 承認をリクエスト
  User->>Cline: 承認
  Cline->>Diff: Diff ビューを表示
  Diff->>User: 変更内容を提示
  User->>Diff: 確認・編集（必要に応じて）
  User->>Cline: 適用を確定
  Cline->>FS: ファイルに変更を書き込み
  FS->>Timeline: 変更を記録
  Timeline->>User: 変更履歴を提供

このシーケンス図から、変更が複数のステップを経て慎重に適用されることが理解できます。

具体例

例 1：新しい React コンポーネントの作成

実際の使用例として、Cline を使って新しい React コンポーネントを作成するシナリオを見てみましょう。

ステップ 1：ユーザーのリクエスト

開発者が Cline に「ユーザープロフィールを表示する React コンポーネントを作成してください」とリクエストします。

ステップ 2：Plan モードでの分析

Cline は Plan モードで以下の分析を行います。

typescriptCopy code// Cline の内部処理（概念的）
async analyzePlan(request: string): Promise<void> {
  // プロジェクト構造を読み取る
  const projectStructure = await this.readFileTree()

  // 既存のコンポーネントを調査
  const existingComponents = await this.findComponents()

  // スタイルガイドを確認
  const styleGuide = await this.readFile('STYLE_GUIDE.md')

  // 提案を生成
  const proposal = this.generateProposal({
    request,
    projectStructure,
    existingComponents,
    styleGuide
  })

  // ユーザーに提案を提示
  this.showProposal(proposal)
}

この段階では、ファイルシステムへの変更は一切行われず、読み取り操作のみが実行されます。

ステップ 3：実装提案の提示

Cline は以下のような提案を行います。

bashCopy code以下のファイルを作成することを提案します：

1. src/components/UserProfile/UserProfile.tsx
2. src/components/UserProfile/UserProfile.module.css
3. src/components/UserProfile/index.ts

既存のプロジェクト構造と一貫性を保つため、
CSS Modules を使用したスタイリングを採用します。

Act モードに切り替えて実装を開始しますか？

ステップ 4：Act モードへの切り替え

開発者が承認すると、Cline は Act モードに切り替わり、実装を開始します。

以下の図は、この一連のフローを示しています。

mermaidCopy codeflowchart TD
  request["ユーザーリクエスト：<br/>React コンポーネント作成"] --> analyze["Plan モードで分析"]
  analyze --> read1["プロジェクト構造を読み取り"]
  analyze --> read2["既存コンポーネントを調査"]
  analyze --> read3["スタイルガイドを確認"]

  read1 --> proposal["実装提案を生成"]
  read2 --> proposal
  read3 --> proposal

  proposal --> approval["ユーザー承認待ち"]
  approval -->|"承認"| act["Act モードに切り替え"]
  approval -->|"却下"| analyze

  act --> create1["UserProfile.tsx を作成"]
  act --> create2["CSS ファイルを作成"]
  act --> create3["index.ts を作成"]

ステップ 5：ファイル作成と Diff 表示

Cline が最初のファイルを作成する際、Diff ビューが表示されます。

typescriptCopy code// UserProfile.tsx の生成例
import React from 'react';
import styles from './UserProfile.module.css';

interface UserProfileProps {
  name: string;
  email: string;
  avatar?: string;
}

/**
 * ユーザープロフィールを表示するコンポーネント
 * @param props - ユーザー情報
 */
export const UserProfile: React.FC<UserProfileProps> = ({
  name,
  email,
  avatar,
}) => {
  return (
    <div className={styles.container}>
      {avatar && (
        <img
          src={avatar}
          alt={name}
          className={styles.avatar}
        />
      )}
      <div className={styles.info}>
        <h2 className={styles.name}>{name}</h2>
        <p className={styles.email}>{email}</p>
      </div>
    </div>
  );
};

開発者はこの内容を Diff ビューで確認し、必要に応じて修正できます。

ステップ 6：スタイルファイルの作成

次に、CSS ファイルが作成されます。

cssCopy code/* UserProfile.module.css */
.container {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
}

.avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
}

.info {
  flex: 1;
}

.name {
  margin: 0 0 0.5rem 0;
  font-size: 1.25rem;
  font-weight: 600;
}

.email {
  margin: 0;
  color: #666;
}

このファイルも同様に Diff ビューで確認されます。

ステップ 7：タイムラインでの追跡

すべての変更が適用された後、VSCode のタイムラインには以下のようなエントリが記録されます。

#	時刻	ファイル	変更内容
1	14:32	UserProfile.tsx	Cline: 新規作成
2	14:33	UserProfile.module.css	Cline: 新規作成
3	14:34	index.ts	Cline: 新規作成

開発者はこのタイムラインから、いつでも変更前の状態に戻すことができます。

例 2：ターミナルコマンドの実行と権限管理

次に、ターミナルコマンド実行における権限管理の例を見てみましょう。

ステップ 1：依存パッケージのインストール要求

開発者が「axios をインストールして API 通信機能を追加してください」とリクエストします。

ステップ 2：コマンド実行の提案

Cline は以下のコマンドを提案します。

bashCopy codeyarn add axios

この時点で、AutoApprove クラスが権限チェックを行います。

typescriptCopy code// 権限チェックの例
const commandApproval = autoApprove.shouldAutoApprove(
  'execute_command',
  'yarn add axios',
  userSettings
);

if (!commandApproval) {
  // ユーザーに承認をリクエスト
  await this.requestUserApproval({
    type: 'terminal_command',
    command: 'yarn add axios',
    description: 'axios パッケージをインストールします',
  });
}

ステップ 3：自動承認の判定フロー

以下の図は、コマンド実行時の承認判定フローを示しています。

mermaidCopy codeflowchart TD
  command["コマンド実行要求:<br/>yarn add axios"] --> yolo{YOLO モード?}
  yolo -->|"有効"| execute["自動実行"]
  yolo -->|"無効"| safe_cmd{"安全なコマンド<br/>リストに含まれる?"}

  safe_cmd -->|"はい"| auto_approve{"自動承認設定<br/>が有効?"}
  safe_cmd -->|"いいえ"| user_approval["ユーザー承認を要求"]

  auto_approve -->|"有効"| execute
  auto_approve -->|"無効"| user_approval

  user_approval -->|"承認"| execute
  user_approval -->|"却下"| cancel["実行キャンセル"]

この図から、複数の条件が段階的にチェックされることが分かります。

ステップ 4：実行結果の監視

コマンドが承認されて実行されると、Cline は出力を監視し、エラーが発生した場合には適切に対応します。

typescriptCopy code// コマンド実行と監視の例
async executeCommand(command: string): Promise<CommandResult> {
  const terminal = vscode.window.createTerminal('Cline')
  terminal.show()

  // コマンドを実行
  terminal.sendText(command)

  // 出力を監視
  const output = await this.monitorTerminalOutput(terminal)

  // エラーチェック
  if (output.exitCode !== 0) {
    await this.handleCommandError(output)
  }

  return output
}

ステップ 5：複数コマンドの順序制御

依存パッケージのインストール後、Cline は API 通信機能の実装に移ります。この際、実行キューが以下のように動作します。

mermaidCopy codesequenceDiagram
  participant Queue as 実行キュー
  participant Task1 as タスク1:<br/>パッケージインストール
  participant Task2 as タスク2:<br/>API クライアント作成
  participant User as 開発者

  Queue->>Task1: 開始
  Task1->>User: コマンド承認要求
  User->>Task1: 承認
  Task1->>Task1: yarn add axios 実行
  Task1->>Queue: 完了通知

  Queue->>Task2: 開始
  Task2->>User: ファイル作成承認要求
  User->>Task2: 承認
  Task2->>Task2: apiClient.ts 作成
  Task2->>Queue: 完了通知

このシーケンス図から、タスクが順序通りに実行され、各タスクの完了を待ってから次のタスクに進むことが理解できます。

例 3：MCP ツールによる外部サービス統合

最後に、MCP ツールを使った外部サービス統合の例を見てみましょう。

ステップ 1：GitHub Issue の取得

開発者が「Issue #42 の内容に基づいてバグ修正を行ってください」とリクエストします。

ステップ 2：MCP GitHub ツールの呼び出し

Cline は MCP を通じて GitHub ツールを呼び出します。

typescriptCopy code// MCP ツール呼び出しの例
async fetchGitHubIssue(issueNumber: number): Promise<Issue> {
  // McpHub を通じて GitHub ツールに接続
  const githubTool = await this.mcpHub.getTool('github')

  // Issue を取得
  const result = await githubTool.execute({
    operation: 'getIssue',
    params: { number: issueNumber }
  })

  return result.data
}

ステップ 3：外部ツール実行の承認フロー

MCP ツールの実行も、標準の承認メカニズムを通過します。

mermaidCopy codeflowchart LR
  request["GitHub Issue 取得<br/>リクエスト"] --> mcp["McpHub に転送"]
  mcp --> github["GitHub MCP ツール"]
  github --> approval["承認チェック"]

  approval -->|"読み取り操作"| auto["自動承認<br/>(設定による)"]
  approval -->|"書き込み操作"| manual["ユーザー承認必須"]

  auto --> execute["API 実行"]
  manual -->|"承認"| execute
  manual -->|"却下"| cancel["キャンセル"]

  execute --> result["Issue データ返却"]

ステップ 4：取得データに基づく実装

Issue の内容を取得した後、Cline は以下のような分析を行います。

typescriptCopy code// Issue 分析の例
async analyzeIssueAndPlan(issue: Issue): Promise<void> {
  // Issue の内容を解析
  const bugDescription = issue.body
  const affectedFiles = this.extractFilesFromIssue(issue)

  // 関連ファイルを読み取る
  const fileContents = await Promise.all(
    affectedFiles.map(file => this.readFile(file))
  )

  // AI に修正プランを策定させる
  const plan = await this.createFixPlan({
    bugDescription,
    fileContents,
    issueLabels: issue.labels
  })

  // ユーザーに提案
  await this.presentPlan(plan)
}

ステップ 5：修正適用と PR 作成

修正が完了した後、Cline は GitHub ツールを再度使用して Pull Request を作成できます。

typescriptCopy code// PR 作成の例
async createPullRequest(
  branch: string,
  issueNumber: number
): Promise<void> {
  const githubTool = await this.mcpHub.getTool('github')

  // ユーザー承認を要求（書き込み操作のため）
  const approved = await this.requestApproval({
    type: 'create_pull_request',
    description: `Issue #${issueNumber} の修正 PR を作成します`,
    details: {
      branch,
      title: `Fix: Issue #${issueNumber}`,
      body: 'Cline によって自動生成された修正'
    }
  })

  if (!approved) return

  // PR 作成
  await githubTool.execute({
    operation: 'createPullRequest',
    params: {
      head: branch,
      base: 'main',
      title: `Fix: Issue #${issueNumber}`,
      body: 'Cline によって自動生成された修正'
    }
  })
}

この例から、MCP ツールが Cline のワークフローにシームレスに統合されていることが分かります。

統合された全体フロー

最後に、実行キュー、ツール権限、差分適用がどのように連携するかを示す統合フローを見てみましょう。

mermaidCopy codeflowchart TB
  start["開発者リクエスト"] --> queue["実行キューに登録"]
  queue --> plan["Plan モードで分析"]
  plan --> proposal["実装提案を生成"]

  proposal --> approval1{"ユーザー承認"}
  approval1 -->|"却下"| plan
  approval1 -->|"承認"| act["Act モードに切り替え"]

  act --> tools["ツール選択"]
  tools --> permission["権限チェック<br/>(AutoApprove)"]

  permission -->|"自動承認"| execute["ツール実行"]
  permission -->|"要承認"| approval2{"ユーザー承認"}

  approval2 -->|"却下"| cancel["キャンセル"]
  approval2 -->|"承認"| execute

  execute --> diff["Diff ビュー表示<br/>(ファイル変更の場合)"]
  diff --> apply["変更適用"]
  apply --> timeline["タイムラインに記録"]

  timeline --> next{"次のタスクあり?"}
  next -->|"あり"| queue
  next -->|"なし"| done["完了"]

この統合フローから、各コンポーネントが有機的に連携して、安全かつ効率的な開発体験を提供していることが理解できます。

まとめ

Cline のアーキテクチャは、AI の強力な能力と人間の判断力を巧みに組み合わせた設計になっています。

実行キューは、タスクのライフサイクルを明確に管理し、複数の操作が競合しないように順序を制御します。これにより、複雑なワークフローでも一貫性が保たれるのです。

ツール権限管理は、AutoApprove クラスと Plan/Act モードの分離により、柔軟かつ安全な制御を実現しています。開発者は、信頼できる操作を自動化しつつ、リスクのある操作には慎重に対処できます。

差分適用メカニズムは、VSCode のネイティブ機能を活用して、変更の可視化と追跡を簡単にします。Diff ビューとタイムライン機能により、開発者は常に変更内容を把握し、必要に応じてロールバックできるのです。

これらの仕組みが統合されることで、Cline は「AI に任せすぎて制御不能になる」ことも、「承認が煩雑すぎて生産性が下がる」こともない、理想的なバランスを達成しています。

Cline を使いこなすことで、AI の力を借りながらも、常にコードの品質と安全性をコントロールできる開発体験が得られるでしょう。ぜひ、これらのアーキテクチャの理解を深めて、より効果的に Cline を活用してみてください。

関連リンク

• Cline 公式サイト
• Cline GitHub リポジトリ
• Model Context Protocol (MCP) 公式ドキュメント
• VSCode Extension API ドキュメント
• Cline アーキテクチャ概要 (DeepWiki)
• Cline ツール統合ガイド (DeepWiki)