SafariでWebアプリケーションを開発する時にオススメな設定

最近、Safariネタが異常に多いのですが...。気にせずに、今回もSafariネタです！

Webアプリケーションを開発している方は、Safariの「環境設定...」→「詳細」→「メニューバーに”開発”メニューを表示」にチェックを入れる事をオススメします。この設定を行うと、SafariでもFirefoxのアドオン「Firebug」と同じような機能を利用できるようになります。（Windows版のSafariからも利用できます！）


↑チェックを入れると、メニューバー「ブックマーク」と「ウィンドウ」の間に「開発」が表示されます。


これは、Safari3.0.4までの「Debug」に相当します。以前は、ターミナルで

defaults write com.apple.Safari IncludeDebugMenu 1

などと入力する必要があったのですが、Safari 3.1では、環境設定から簡単に表示/非表示を切り替える事ができるようになりました。また、プロパティは「IncludeDevelopMenu」に変更されたようです。

Safari 3.1の「開発」は、メニューも日本語化され、機能面でも強化されています。手軽に利用できるようになったので、一度試してみる価値はあると思います。

ここからは、「開発」から実行する事ができる主な機能をいくつか紹介したいと思います。先のエントリでも紹介した「Notes Demo」にアクセスした状態で、Safariのメニューバー「開発」→「Webインスペクタを表示」を実行すると、次のような画面が表示されます。


↑Webインスペクタの画面。ここから様々な機能を利用できます。

Safari 3.1のWebインスペクタでは、クライアント側のデータベースを表示する機能や、ネットワークの転送状況を視覚的に表示する機能が追加されています。


↑クライアント側のデータベースからデータを表示。SQL文を実行する事もできる。



↑ネットワーク画面。このページを表示するために掛かったサイズ、時間をそれぞれ視覚的に表示させる事ができます。（もう少し複雑なページで見るともっとキレイですｗ）


これ以外にもユーザエージェントを指定してページを開いたりする事もできます。という訳で、「開発」をメニューバーに追加すると、Webアプリケーションを開発する時に役立つ様々な機能を利用できるようになります。正直、私も使いこなしているとは言えないのですが、これなら「Firebug」を頼らずに済むかもしれない...と思い始めました。これから積極的に利用してみようと考えています。