要素単位とページ全体の検査
要素にカーソルを合わせるか、ツールバーアイコンをクリックしてページ全体を調べます。Archifyはスタック、ホスト、トラッカー、近くのスクリプトを特定し、それらを選択した要素に結び付けます。
概要
Archifyは、Webアプリケーションが外からどのように構成されているかを理解するためのブラウザ拡張機能です。ソースコードではなくライブページを調べ、コンポーネント、API、ライブラリ、ホスティングの手がかり、その他の実行時シグナルをブラウザ内で直接明らかにします。
この製品は、調査しているページを離れずに挙動を素早く追跡したい開発者向けです。ローカル分析、証拠に基づく解釈、慎重な出力を重視しており、詳細を検証できない場合は結果を作り出さず unknown を表示します。
Archifyの機能
ローカルな実行時分析
この製品は、フレームワーク内部、ネットワークリクエスト、DOM、フォームフィールドのリスナーなどの実行時シグナルを読み取ります。サイトでは、これらはすべてブラウザ内でローカルに行われると説明されています。
信頼度スコア付きの結果
検出された項目は、信頼度スコアと証拠付きで表示されます。Archifyが何かを検証できない場合は、推測せずに unknown と表示します。
幅広い技術の検出
ホームページでは、フレームワークとランタイム、UIライブラリとスタイリングシステム、分析ツールとピクセル、コマースプラットフォーム、CMS、ホスティング事業者、認証ツール、保護機能にまたがる検出範囲が案内されています。
機微なフィールドの可視性
Archifyは、どのサードパーティスクリプトがフォームや支払い入力を監視しているか、どの外部ドメインが関与しているかを含め、機微なフィールドに触れる要素を可視化できます。
リクエストと状態の追跡
このワークフローでは、目に見えるUI操作を、その影響を受けるコンポーネント、API呼び出し、ストレージ項目、ルートへたどることに重点を置いています。
Archifyの一般的な使い方
フロントエンドの問題をデバッグする
UIの症状を、その原因になっている可能性のあるコンポーネント、API呼び出し、ストレージやルートの変更までたどります。見た目のバグが原因をすぐに示さない場合に役立ちます。
クライアント側の露出を確認する
チェックアウト、ログイン、フォームのフローを調べて、どのスクリプトが機微なフィールドを監視しているか、どの外部ドメインやサードパーティサービスが関与しているかを確認します。
外部アプリケーションを調べる
ソースコードを開かずに、公開サイトがどのスタック、ホスティング、分析ツール、UIフレームワークを使っているかを確認します。これは競合調査や技術的デューデリジェンスに役立ちます。
QAレポートに技術的な詳細を追加する
QAがスクリーンショットだけよりも実用的なメモを提供できるよう、コンポーネント、リクエスト、ステータスの文脈をバグ報告に添付します。
アーキテクチャを素早く把握する
ソースマップ、複数のDevToolsパネル、別の監査ツールへ切り替えずにアプリを素早く理解したいとき、ブラウザ自体を検査面として使います。
Pros and Cons
Pros
- ブラウザ内でローカルに動作し、アカウントは不要です。
- 表層の検査は素早く行えるよう設計されており、要素にカーソルを合わせるかツールバーアイコンを使ってページを調べられます。
- コンポーネント、API、ストレージ、ルート、近くのスクリプトなど、アプリの複数の層をまとめて表示します。
- 信頼度スコアと証拠を付けるため、結果が推測として示されることはありません。
- フレームワーク、UIライブラリ、分析ツール、コマースプラットフォーム、CMS、ホスティング、認証、保護機能など、幅広いWeb技術を対象としています。
Cons
- サイトによると、正確なコンポーネント名は開発ビルドでのみ利用可能で、最小化された本番コードではコンポーネントタイプと信頼度スコアしか得られない場合があります。
- chrome:// や拡張機能ストアなどのブラウザ内部ページでは動作しません。
- ホームページでは、DevToolsの完全な代替ではなく補完的な存在として位置づけられています。
FAQ
Archifyは無料ですか？
はい。ホームページでは、Archifyは無料でオープンソース、Apache-2.0ライセンスで提供されており、アカウント、ペイウォール、トライアルは不要と説明されています。
データはブラウザの外に送信されますか？
いいえ。製品では、分析はブラウザ内でローカルに実行され、サーバー、テレメトリ、分析機能はなく、ページ内容は保存も送信もされないと説明しています。
どのフレームワークやコンポーネントを検出できますか？
React、Next.js、Vue、Angular、Svelte などのフレームワークに加え、他の多くの技術も検出します。正確なコンポーネント名については、開発ビルドが最も詳細で、最小化された本番コードでは、捏造された名前の代わりにコンポーネントタイプと信頼度スコアが表示される場合があるとサイトは案内しています。
どのサイトでも使えますか？
選択して調べたい任意のWebページで使うことを想定していますが、ブラウザのポリシーにより、chrome:// ページや拡張機能ストアなどのブラウザ内部ページでは動作しません。
DevToolsの代わりになりますか？
いいえ。サイトでは、Archifyはアーキテクチャと実行時の関係を表示し、DevToolsは実装を表示すると説明しています。両者は置き換え可能ではなく、補完的なツールとして位置づけられています。
Quick Facts
- カテゴリ
- 開発者向けツール
- 製品タイプ
- ブラウザ拡張機能
- プラットフォーム
- Chrome
- 主な利用者
- フロントエンドエンジニア、QAエンジニア、技術系創業者
- ソースドメイン
- archify.salahxd.dev
- 価格
- Apache-2.0で提供される無料のオープンソース
Archifyの代替品
ByteAsk
ByteAskは、C/C++向けのターミナル起点AIコーディングエージェント。リポジトリを編集し、コンパイラやデバッガ、サニタイザ、テストで変更を検証してから差分を表示。無料枠あり。
Manta AI
Manta AIは、URLからアプリの挙動を把握し、回帰を検出し、スクリプトやセレクタ管理なしでテストを生成できる自律型Webアプリテストツールです。
CreateOS Sandbox
CreateOS Sandboxは、FirecrackerマイクロVM上でコードやエージェントのワークロードを実行できる分離型コンピュート環境です。SDK、CLI、MCPで制御可能。
hob
hobは、エージェントのセッション、ターミナル、履歴、後続作業を、既存のツールやプロバイダーに合わせて整理できる独立したコーディングエージェント向けワークスペース。ローカルでの制御を重視する開発者に最適。
Ably Chat
Ably Chatは、カスタムのリアルタイムチャットアプリを構築できるチャットAPIプラットフォームです。ルーム単位のメッセージ、入力中表示、プレゼンス、リアクション、メッセージ更新に対応し、利用量ベースの料金も選べます。
SonOf
SonOfは、リポジトリとPMツールに接続し、コードベースと周辺の製品コンテキストを監査して、承認済みの作業をシニアエンジニアのレビュー付きで公開済みチケットに変えます。