JavaScriptで実装された簡易版Firebug - Firebug Lite

7月25日(米国時間)、Firebugの機能をJavaScriptで実装した「Firebug Lite 1.2」が公開された。FirebugはDOMインスペクタやXHR(XMLHttpRequest)のトラッキングをはじめとした、Webデベロッパにとって嬉しい機能が実装されているFirefoxアドオンだ。これまでFirebugの恩恵を受けるにはFirefoxの導入が必須だったが、Firebug Liteを使用することでFirebugの一部の機能をIEやSafari、Operaなどでも利用できるようになる。

とくにJavaScriptの動作はWebブラウザ間での差異があるため、実装した機能がデバッグの段階で一方のWebブラウザでは動作するがもう一方のWebブラウザではうまく動作しないということがよくある。Firefox以外のWebブラウザでXHRトラッキングが利用できることになったのは心強い。本稿ではいくつかのサンプルを使いながら、Firebug Liteの使い方とFirebugとの動作の違いを紹介する。

Firebug Liteの導入

Firebug Liteを利用するための方法は2種類ある。

• Firebug Liteを利用したいWebページにあらかじめ<script>タグでfirebug-lite-compressed.jsをロードする

• Firebug Liteを利用したいWebページでブックマークレットを使い、firebug-lite-compressed.jsをロードする

簡単に試す分にはブックマークレットとして使用するのが便利だ。Firebug Liteのページでブックマークレットの登録手順があるので参考にしてほしい。頻繁に使用する場合はFirebugのWebサイトに負担をかけないためにもローカル環境でfirebug-lite-compressed.jsをロードして利用するようにしておきたい。