【しばらく編集不可モードで運営します】 編集(管理者用) | 差分 | 新規作成 | 一覧 | RSS | FrontPage | 検索 | 更新履歴

OperaDragonflyArchitecture - Opera Dragonfly のアーキテクチャ

目次

Opera Dragonfly のアーキテクチャ

この文書について

はじめに

この記事では Opera Dragonfly のアーキテクチャを詳しくとりあげる. アーキテクチャにある個別のコンポーネントが何か, Dragonfly の動作中にそれがどう連携するのかを示す.

アーキテクチャ概観

Opera Software 社の開発ツールである Opera Dragonfly のアーキテクチャは, デスクトップと同様に携帯電話など他のデバイスもデバッグできるよう設計されている.

"Scope" モジュールはランタイムに関する情報を公開する. デバッグされている Opera のインスタンスが 表示しているページやアプリケーションが何かといったものだ. このインスタンスはデバッグのホストとして振舞い, こうした情報をクライアントに提供する. 送受信するデータのフォーマットは "Scope protocol" で定義される.

ファイアフォールがあるかもしれないという問題を克服するため, "proxy" がブラウザとデバッガの通信に介在する. たとえば, 携帯電話上のウェブページをデバッグするのに, ふつうのデスクトップコンピュータを使いたいということ.

"client", つまりデバッガアプリケーションは情報を可視化してユーザが実行時の状態を操作できるようにする.

host と client は同じデバイスでも異なるデバイスでもうごく. proxy はインスタンスの中でも別のサーバとしても動く.

デバッグのシナリオ

デバッグをするにあたって, 代表的なやりかたは二つある:

統合: scope と proxy と debugger が同じ Opera インスタンスの中で動く

リモート: scope と debugger は二つの異なる Opera インスタンスで動く. たとえば 二つのデバイスで動くなど. proxy はどちらか一方で動くか, 別のコンピュータで動く.

統合

これはよくあるシナリオだ. 開発者は普通の Opera ブラウザで動くウェブアプリケーションに対して 作業をしている. デバッガは同じインスタンスで動作し, 別のウィンドウやブラウザウィンドウに統合されたパネルに表示される.

この場合, デバッグ対象の host, proxy, client はみな同じブラウザインスタンスで動く. proxy は Opera の選んだランダムなポートで動作し, scope モジュールやデバッガは 自動でそこに接続する.

リモート

このシナリオの例は携帯電話のウェブページやアプリケーションをデバッグするケースだ. 電話は画面サイズが限られており, 開発するにもやりにくい. そこでデバッグにはデスクトップコンピュータをかわりに使う.

ある Opera インスタンスを同じデバイスで動作する別のインスタンスから デバッグすることも考えられる. デバッグしているホストがクラッシュしそうな時には便利だ.

リモートデバッグは以下のような場合にわけることができる.

 
後者のシナリオは, デバッグしているインスタンスかデバッガのどちらか一方, または両方が ファイアウォールの後ろにあるときにあてはまる.

コンポーネント

Runtime

各 ECMAScript 環境はそれぞれが単一の runtime である. したがって, 各 HTML 文書には関連づけられた runtime がひとつある. frame や iframe も個別に runtime を持っている.

Debugging host

debugging host は任意の Oepera インスタンスで, scope モジュールが有効に されたものをさす. インスタンスはプロキシに接続している. これは複数の runtime を含むかもしれない.

Scope モジュール

Scope モジュールは Opera アプリケーションの一部である. 有効にすると, モジュールは proxy の URL に接続を張って debugging host にある全ての runtime を調べる(inspect). 次にモジュールはその情報をデバッガに送信する. またデバッガからのコマンドに応じることもする. コマンドには選択された DOM の取得などがある.

Scope プロトコル

Scope プロトコルは host と client の runtime に関する情報を交換するための ルールとフォーマット一式である. たとえば DOM の文書構造や CSS の computed style を runtime からとりだす.

注: Scope プロトコルは今のところ開発中である. 開発が終わり次第, 仕様は public になる. ベンダは自身でデバッグ用 client を開発したり, (Aptanna や Eclipse といった) IDE アプリケーション などにそれを統合することができる. Scope プロトコルを使えば, 各種クライアントは Opera ブラウザの runtime 情報を 取得することができる.

Proxy

proxy はブラウザとデバッガ間でメッセージを配信する役割をもつ. これはリモートでのデバッグをするシナリオで特に重要となる. そうした状態では, debugging hostク とライアントは同じコンピュータ上にない.

Opera はデバッガの動作するインスタンスに統合した proxy を提供する. ただし, proxy は公開サーバとして動かすこともできる. こうすることで, デバッグするインスタンスとデバッガを ファイアウォールの後ろに置くことができる.

デバッグの client

デバッガはデバッグするホストの scope モジュールに接続するクライアントである. デバッガはインスタンス内にある runtime に関する説明をうけとる. runtime を可視化し, ユーザが変更できるようにする. 変更は scope プロトコルを使い, scope モジュールに要求を送り返すことで行う.

現在のデバッガ実装は完全に web 技術を使って作られている: HTML/XML, CSS, JavaScript を用いる.