Claude Codeエージェント監視ダッシュボード

Agents Observeの機能

Agents Observeは、Claude Codeエージェントチーム向けに特別に構築されたリアルタイム可観測性ダッシュボードです。Claude Codeが自律的に実行される際（サブエージェントの生成、ツールの呼び出し、ファイルの読み取り、コマンドの実行）の可視性ギャップに対処し、すべてのフックイベントを発生時にキャプチャしてライブダッシュボードにストリーミングします。

主な機能とアーキテクチャ

このツールは、開発者が「エージェントアクションの完全な全体像」と表現する情報をキャプチャするために、OTEL（OpenTelemetry）の代わりにClaude Codeフックを使用します。アーキテクチャは以下のフローに従います：

Claude Codeフック → observe_cli.mjs → APIサーバー（SQLite） → Reactダッシュボード
フックスクリプトは標準入力から生のイベントを読み取り、プロジェクト名を追加してサーバーにPOSTします
サーバーはイベントを解析し、エージェントメタデータ（名前、タイプ、親子関係）を保存し、イベントをWebSocketクライアントに転送します
Reactダッシュボードはすべてのエージェント状態をイベントストリームから導出します

ダッシュボードでは以下のことができます：

ツール呼び出しが発生時にストリーミングされるのを監視（結果付きのPreToolUse → PostToolUse）
完全なエージェント階層を表示——どのサブエージェントがどの親エージェントによって生成されたか
エージェント、ツールタイプ、またはすべてのイベント全体で検索してフィルタリング
任意のイベントを展開して完全なペイロード、コマンド、結果を表示
タイムラインアイコンをクリックしてストリーム内の特定のイベントにジャンプ
人間が読める名前（例：「twinkly-hugging-dragon」）で履歴セッションを閲覧

インストールとセットアップ

前提条件：

Docker（必須——サーバーはコンテナとして実行されます）
Node.js（必須——フックスクリプトはnode経由で実行されます）

プラグインインストール手順：

claude plugin marketplace add simple10/agents-observe
claude plugin install agents-observe

Claude Codeを再起動後、サーバーは次のセッションでDockerコンテナとして自動起動し、フックがイベントのキャプチャを開始します。ダッシュボードはhttp://localhost:4981で利用可能です。

プラグインスキル

/observe — ダッシュボードURLを開き、サーバーが実行中か確認
/observe status — サーバーの健全性を確認し、ダッシュボードURLを表示

開発からのパフォーマンス洞察

開発者は、このツールの構築と使用から得られたいくつかの技術的知見を共有しました：

Claude Codeフックはブロッキング——フックを使用する多くのプラグインがあるとパフォーマンスが急速に低下
フックはOTELデータよりも有用な情報を提供
Claudeのjsonlファイルは完全な全体像を提供
プラグインによって開始されたMCPプロセスのライフサイクル管理は「せいぜいやや不格好」
バックグラウンド（発射後放置）フックへの切り替えと他のプラグインの削除により、Claudeのパフォーマンスが大幅に改善

開発者は、サーバーがアクティブな接続を追跡し、使用されていないときに自動シャットダウンし、新しいセッションが開始されたときにプラグインが再起動するプロセス管理ソリューションを実装しました。このDockerベースのアプローチは、サービスを分離することでセキュリティを向上させる可能性のあるパターンとして注目されています。

📖 Read the full source: HN AI Agents