【ハウツー】Webデバッガに新星登場!? 操作を記録し、イベント/DOMを一発解析 - FireCrystal (1) FireCrystalとは | エンタープライズ | マイコミジャーナル
複雑な機能をいくつも実装したWebアプリケーションのデバッグはツールなしでは一苦労だ。Ajax処理やこまかいイベント制御・DOM操作をおこなっている箇所でバグを出してしまった日には、解析だけで大変な時間を割かなければならない。 そんなときは、FireCrystalを使えば解決するかもしれない。ユーザの操作を記録し「どのタイミングで」「なにがおこなわれているか」を一発で表示してくれる便利なアドオンだ。 本稿では、そのFireCrystalについて紹介しよう。 FireCrystalとは Stephen Oney氏は8月21日(米国時間)、Firefox上で動作するアドオン「FireCrystal」をリリースした。FireCrystalはThe MIT Licenseのもとで公開されている、Webデザイナ・デベロッパ向けのデバッガ。Webページ上でユーザの操作を記録し、内部でどのようなイベント
Bespin - Backnumbers: Steps to Phantasien
六本木にある SNS の会社で開催されたデータベースの勉強会に向かった私は道に迷って会場に辿りつけず失意のまま帰宅した. もうサーバサイドなんて知らねーよ! そう(地図を忘れた自分に)憤り, 現実逃避にクライアントサイドのコードでも読むかと Bespin を眺めた. Bespin は Mozilla が開発中のウェブで動くテキストエディタサービス. デモ版 が公開されている. もう少し詳しい話 によると, HTML5 の <canvas> で色々実装しているらしい. そういえばそんな機能があったなーと思いだし, どんなものかと コード をチェックアウトした. ツリーの構成 Bespin のソースは今のところ約 3 万行 ある. サードパーティのライブラリを除くと 2 万行くらい. backend/ frontend/ mocks/ slices/ docs/ research/ templ
XMLHttpRequestでRefererをセットする - FAX
JavaScript 追記Firefox 3.0で確認したところエラーになった。 Firefox 2.0.0.13で確認しました。 var url = 'http://localhost:8080/index.html'; var referrer = 'http://www.hatena.ne.jp/'; var req = new XMLHttpRequest(); req.open('GET', url, true); req.onreadystatechange = function(){ // 1: 読み込み中 if(req.readyState == 1) req.setRequestHeader('Referer', referrer); // 4: 準備完了 if(req.readyState != 4) return; console.log(req.responseTe
Webベースのアプリケーションをオフラインでも
オフラインアプリケーションの課題 iNetOfficeのスナイダー氏によると、Webアプリケーションという観点からの最大の課題の1つは「ユーザーにとってできる限り単純で分かりやすくすること」だという。スナイダー氏によると、ブラウザ開発やWebアプリケーション開発に携わっている人たちにとってはオンライン/オフラインという考え方は直観的であるものの、「例えば花屋を経営している人にとっては……そんなユーザーにオンライン/オフラインについて説明しても、彼らの目はどんよりとしてくるんだ。理解したくもないし、どうでもいいし、といったことだから。ただただ、ちゃんと動いてさえくれればいいと思っているんだ」という。 スナイダー氏によると、表計算やワープロのようなWebベースアプリケーションをオフラインでちゃんと動かすのは比較的簡単な部類なのだという。というのもそのようなアプリケーションは「より中央集権的」で
FirebugによるWebコードのデバッグ | OSDN Magazine
Webサイトの開発は、世紀の変わり目となった7年前の頃ほど単純な作業ではない。新たなツール、テクノロジ、開発方法論の氾濫により、もはやWebページはかつての単純なHTMLコードの列ではなく、各種のスタイルシート、マークアップ言語、スクリプトが複雑に入り混じったものになっている。だが、こうした複雑なブレンドものをデバッグするのは容易ではない。そこで登場するのが、WebブラウザFirefox用のオープンソースのアドオンFirebugだ。このアドオンを使えば、CSSおよびJavaScriptの単純なテンプレートから複雑なAjaxアプリケーションに至るまでのすべての編集とデバッグを行うことができる。 各種Webプロジェクトの作成とデバッグに携わるWeb開発者を支援するアプリケーションは、いくつか存在する。SANIsoftの最高技術責任者で『Professional PHP4 Programming
Firefoxの最新状況
JavaScript 2.0への移行 JavaScriptが結局おもちゃの言語に過ぎなかった当時は、Webページの見栄えが多少派手になればよく、それ以外のことはどうでもよかったのではないか？ そんな時代ははるか昔のことで、シュレーファー氏によれば、この言語は将来もっとずっと堅牢になるという。 Firefox 2.0にはJavaScript 1.7が組み込まれることになっている。JavaScriptとしては約6年ぶりのメジャーアップデートだという。 JavaScript 2.0も開発中だ。シュレーファー氏によれば、「現在、標準化団体で検討されている」という。具体的には、Ecma InternationalがECMAScriptという名前で標準化を進めている（ECMAScriptではまるでニキビ薬のようなので、Mozillaプロジェクトがオリジナルの名前から離れられないのも無理はない）。 標準
Firefoxの最新状況
今年のクリスマスには、Firefox 2.0の姿を目にすることができそうだ。ところで、Firefoxは今どんな変化が加えられようとしており、どこへ向かおうとしているのかご存じだろうか？ 先週、オレゴン州ポートランドで開催されたO'Reilly Open Source ConventionでMozilla Corp.のマイク・シュレーファー氏と数分座談する機会を得た。内容はFirefoxを中心に開発、セキュリティ、JavaScriptのアップデート、そして LinuxベンダーそのほかFirefoxの下流プロバイダとの連携にまで及んだ。 自動アップデート機能の追加でFirefoxはすこぶる進歩した。ブラウザの全ユーザーにセキュリティアップデートを短時間でプッシュする体制が確立したからだ。ただし、自動アップデート機能の恩恵を受けるのはブラウザをMozillaから直接入手したユーザーに限られ、Li
FireBug に JavaScript デバッガが付いて便利すぎる件について - IT戦記
Firebug を更新したら、またもや凄いことになってました。 まずはこれを見てください。 http://sample.ecmascript.jp/20060526.htm 要は JavaScriptをステップ実行しながら結果を確認できる。 変数の値をウォッチできる。 適当にブレークポイントを貼ってスタックを追えば、他人のサイトを簡単にハックできる。 うれしい！たのしい！こんにちわ！ FireBug のインストール https://addons.mozilla.org/extensions/moreinfo.php?application=firefox&id=1843
Extension Packaging - MDC
拡張機能は、利用者がダウンロードやインストールできる Installable Bundleの形式または、pre-パッケージされてアプリケーションまたは拡張プログラムと共に提供されます。拡張機能はXULプログラムの機能を拡張するための chrome、コンポーネント、およびその他のファイルを提供するのに ディレクトリ構造を使っています。 すべての拡張は、拡張機能についてのメタデータ(ユニークID、バージョン、制作者、および互換性情報など)を含むinstall.rdfファイルを備えなければなりません。。 拡張機能のファイルとinstall.rdfの用意ができたら、いくつかの方法で拡張機能のインストーラを作ります: 拡張機能ディレクトリをユーザがインストールできる XPI (xpinstall) ファイルにZIP圧縮、ユーザのアプリケーション profile ディレクトリに拡張機能ディレクトリを解
IT戦記 - FireBug の新しいバージョンが便利すぎる件について
FireFox の拡張機能 FireBug を更新したらすごいことになっていたので共有します。 まずこれを見てください http://Sample.ECMAScript.jp/20060331.html ぱっと見の機能 HTML のソースを見ながら、属性値を直接編集できる。 影響のある CSS を即時に表示 レイアウト情報を即時に表示 インスペクト中の要素に浮上したイベントをキャプチャ インスペクト中の要素の JavaScript オブジェクトを表示 Ajax レスポンスのヘッダも確認できるようになった。 FireBug のインストール https://addons.mozilla.org/extensions/moreinfo.php?application=firefox&id=1843
JavaScriptでXPCOMを作る: Days on the Moon
FirefoxのUIはXULとJavaScriptで構成されていますが、JavaScriptの組み込みオブジェクトだけではファイル操作やウィンドウ操作などができません。そこで登場するのがXPCOM、これを用いることでOSに絡んだ操作やRDFの操作などが行えるようになります。 Firefoxに付随するXPCOMコンポーネントの多くはC++でかかれ、プラットフォーム別にコンパイル作業などが必要なのですが、XPCOMはJavaScriptを用いて作ることもでき、これならOSにあわせてコンパイルする必要はありません。そこでここでは実際にJavaScriptでXPCOMを作ってみることにします。 今回作成するXPCOMコンポーネント(nntPerson)は人物をあらわすもので、年齢を示すageプロパティと年齢を言うsayメソッドを持つものとします。また、以下ではWindowsで作成することを前提とし
日付別表示ページの場合でも見出しタイトルを取得できる、はてなブックマーク用bookamarklet - facet-diary'
日付別表示ページ(各見出しがname属性で区別される)タイプのダイアリーだと、ブックマークするときに見出しが取得できなくて面倒なんですよね。ということで、作ってみました。 javascript:t=document.title;a=location.hash;if (a){e=document.anchors[a.substring(1)].parentNode;if (e.nodeName.toLowerCase().indexOf('h')==0)t+=' '+e.textContent;}location='http://b.hatena.ne.jp/add?mode=confirm&title='+escape(t)+'&url='+escape(location.href); 見出しの冒頭の■をクリックしてURLに#〜が付くようにしてから、このbookamarkletを使ってくだ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
これで完璧?del.icio.usとの付き合い方 | caramel*vanilla