FireBugには、Chromeの開発者ツールにはどのような機能がありませんか？ [閉まっている
https://stackoverflow.com/questions/3124974
-
30-09-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian質問
私は初心者のWeb開発者であり、何度かデバッグすることをお勧めします。しかし、これまでのところ、Chromeの組み込み開発者ツールを使用しています。 FireBugが行うすべてのことを行うようで、ボーナスとしてよりクリーンで整理されています。
デバッグがより高度になると、ChromeのDevtoolsで見逃しているFirebugが持っている機能はありますか？もしそうなら、彼らは何ですか？
解決
私は最初からFirebugを使用しましたが、それは火の発明のような天の恵みでした。しかし、その後、Chromeがデバッガーで出てきて、私はそれを試しました。私はFireBugを使い続けましたが、Chomeの開発ツールに注目していましたが、V12にJSONツールが追加された後に切り替えない理由を最終的に思いつくことができなくなりました。
ChromeのDevToolsは、次のように尻をキックします
- 組み込みのタイムライン、プロファイラー、ヒープアナライザー
- 組み込み監査ツール
- Local/SessionStorage、Cookie、SQLITE DB、WebQL、AppCacheなどにアクセスして編集できます...
- WebSocketsネットワークスニッフィング
- JSデバッガーにはいくつかの機能があります（例：Webworkerブレークポイント）
- JSデバッガーJSをその場で編集して実行してください（フィドル付きJSFiddle）
- 各ウィンドウは、必要に応じてdevtoolsウィンドウを取得します。 Firebugはシングルトンです
- FireBugは、その積み込みを減速させ、検査官機能にCSSを注入することでページを奪います
更新：2年後、私はFirefoxチームが巨大な侵入をしてくれたことを祝福しなければなりません。とはいえ、Chromeチームとデバッガーは毎月大きな飛躍を遂げ、業界をリードしています。上記のリストを更新しますが、率直に言ってページ全体が埋められます。
他のヒント
Chromeに切り替えた後、まだ見逃したFireBug機能に遭遇していません。
Firebugを使用してはるかに快適に感じています。現時点では詳細を考えることはできませんが、サファリやクロムで何かをデバッグしようとすることもありますが、Firefoxを起動してすぐにやることを得るのは、そのようなピタのようです。
DOMタブはプラスです。 Chromeの同等物よりもアクセスしやすく、よくレイアウトされています。 DOMや他のJSオブジェクトがFireBugのコンソールにログに記録される方法を好みます。
Pixel PerfectのようなFirebugプラグインも非常に便利です。そのようなツールがChromeに存在するかどうかはわかりません。
とにかく、両方のブラウザでテストする必要があるため、全体としては問題ではありません。そして、つまり、IEの開発ツールと比較することもできます（これは改善されていますが、FFやWebKitに比べて良くありません）。
Firebugには特に存在するものは何もないと思いますが、Chromeには欠けているとは思いません。
Chrome開発者ツールはFireBugの機能を引き継いだため、すべての主な機能と親しみやすさがあります（ $0, 、 と console 物体）。
devtoolsが持っていないなど、いくつかの小さな違いがあります CSS パネル（ただし、CSSスタイルシートはで操作できます 要素 パネル）。
さらに、Chromeツールにはがあります タイムライン, プロファイル と ストレージ パネル。 タイムライン パネルログの読み込み、CSSレンダリング、およびJavaScriptの解析。 プロフィール パネルプロファイルリソースの使用法と ストレージ パネルは、サイトのデータベース、ローカルストレージ、セッションストレージ、およびCookieの変更を示しています。
最後に、どちらのツールにも独自のマイナーな分散があり、さまざまなアクションが少し簡単または難しくなります。私のアドバイスは、FirefoxにFirebugを使用し、WebKitブラウザーにDevToolsを使用することです。FireBugLiteのみがChromeで動作し、通常のFirebugには多くの機能がないためです（そしてDevtoolsはChromeに組み込まれています）。
編集: ：これは以前は真実でしたが、Chrome Dev Toolsが実装しました。
FireBugは、ページにロードされたすべてのスクリプトで検索できます。 Chrome Dev Toolsは、現在選択されているスクリプトAFAIKでのみ検索できます。
私が知る限り、FireBugは、HTML-Codeを編集してテキストをライブで編集できる唯一のものです。たとえば、テキストがコンテナにどのように適合するかを確認し、一度に1つの文字を追加する場合、非常に便利です。
HTMLを編集するときにChromeでは、タブを押すか、「編集モード」を終了し、ページの変更を確認する必要があります。
FireBugでは、すぐにHTML-Codeを入力することもできます。 Chromeでは、右クリックして「HTMLの編集」を選択する必要があります。それ以外の場合は、u003Cb>太字u003C/b>のように表示されます。
Chromeはより速く実行されるように見えるので、Chromeに変更したいのですが、ライブ編集は私にとってあまりにも重要です。
Mouse Selection FireBugには素晴らしいですが、Chrome開発者ツールでそれを見つけることができないようです。
Chromeには完全に欠けているのに対し、Firebugでホットキーが見つからないため、私を悩ませます。
私はNOOB開発者なので、マウスはほとんどの場合、開発時にまだ使用されています。
当時、この質問はFirebugは獣であると尋ねられましたが、今ではChrome開発者ツール（DevTools）がWeb開発者に便利です。 Firefoxを使用してWeb開発を学んだので、Firebugを使用してWeb開発を学んだので、私はFirebugについて暴言していませんが。
これはWeb開発に最適なツールであり、DevtoolsとFirefoxのDevtoolsが持っているすべての主要な機能を紹介しました。ただし、Firebugのすべての機能をカバーしていませんが、Chrome Devtoolsに切り替えました。これは、Firebugよりもはるかに速いため、LocalStorageにアクセスすることが簡単に定義され、ソースがそこに組織されているためです。
ここでは、Firebugで機能がどのようにユニークであるかをリストします。
探す:
検索オプションはFireBugで明確に定義されています。これは簡単にアクセスでき、キーワードを検索できるため 大文字と小文字を区別 と 正規表現.
DOM：
DOM構造は、さまざまなさまざまなFirebugで簡単にアクセスできます フィルタリングオプション お気に入り ユーザー定義のプロパティを表示します, ユーザー定義の関数を表示します 等々。
クッキー：
FireBugは私たちを作成させることができます 自分のクッキー そして、に規定を与えます クッキーをエクスポートします.
ネットワーク/ネット：
FireBugには ネット devtoolsがそれを呼ぶパネル 通信網. 。どちらも、リソースとそのステータスをロードするために行われたすべての要求を分析するのに役立ちます。 Firebugでは、リソースを簡単に把握できます。 リモートIP.
出典：
であっても ソース編集 devtoolsで利用可能です、私は使用中にFirebugがより良いと感じています ソース編集, 、DevTools内のCSSファイルを編集したい場合は、 ソース パネル、次に押します Ctrl+o ファイルを見つける。その場合にのみ、ファイルを編集できます。 Firebugでは、簡単に見つけることができます ソース編集 すべてのメニュー]タブの下。
道場のサポート：
かつて私が道場の開発者であったことは、Firebugでした Dojoの開発をサポートするために簡単に拡張できます を使用して Dojo Firebug拡張機能.
客観的に見られるFireBug 2.0には、Chrome Devtoolsが持っていない多くの小さな機能があります。それらのいくつかはここにリストされています：
- 要求情報全体を含むxmlhttprequestsを表示します
- クッキーの変更を表示します
- もう少し コマンドラインAPI 関数
- 別 コマンドエディター
- インラインの編集 AttibutesおよびCSSスタイルの自動完了
- 変更を強調するかどうかを制御するオプション、それらを拡張し、スクロールするかどうか
- エンティティディスプレイを制御するオプション
- クイック情報ボックス
- フォーマットされた方法でページのスタイルシートを表示します
- セレクター サイドパネル
- すべてのDOMプロパティを1つの場所に表示します
- ディスプレイ 閉鎖
- プロパティ、機能などでディスプレイをフィルタリングできます。
- xmlhttprequestsで停止できます
- 要求ごとにキャッシュ情報を表示します
- Cookieを作成および編集します
- Cookie許可を制御します
- Cookieの生およびフォーマットされたサイズを表示します
- Cookieの変更でスクリプト実行を停止できます
- 標準形式でクッキーをエクスポートします
全般的
- 外部エディターでHTML、CSS、およびJavaScriptを開きます
- ショートカットをカスタマイズできます
使いやすさを超えている「機能」は、firebugが オープンソース. 。だから誰もがそれに参加することができます。
そうは言っても、Chrome Devtools（およびFirefox Devtools）には、他のDevtoolsの背後にあるチームと比較してFirebugの背後にあるチームが非常に小さいため、Firebugよりも多くの機能やその他のより小さな利点があります。
また、 Firebug 3+は、組み込みのFirefox Devtoolsに統合されます, 、これは、これらのバージョンがFirefox Devtoolsのすべての機能を継承し、追加の機能を追加する可能性があることを意味します。
firebugには、そのような他のプラグインを接続する可能性があります firecookie. 。残りはかなり似ていますが、私の意見では味がすべてです。
また、xopy xpathがHTML要素にCSSセレクターを追加できることを追加します。
それは時々本当に便利です！ ：））） ははは
開発ツールは似ていると思いますが、Chromeに何もキャッシュしないように強制するのに苦労しました。 Chromeの「無効キャッシュ」設定を設定しても、100％の時間は機能しませんでした。理由がわかりません。
Firefox/Firebugでこの問題はなかったので、まだ使用しています。
私の数セントを追加...
Chrome Inspectorは、Firebugがこれを魅力のように行うことができる場合、CSSプロパティをアルファベット順に並べ替えることができませんでした。 CSS要素を検査するときに役立ち、それをつかむ必要がありますFireBugはこれに便利です。
優れたCSSコーディングの練習によると、CSSプロパティをコードでアルファベット順にソートする方が常に優れています。
Scripts.in FireBugの多くのScripts.in FireBugに関係するプロジェクトに取り組んでいる場合、提供されている提案ボックスでJSファイルを検索するオプションがあります。 Chromeと同様に、JSファイルの名前が表示されてツリーを横断するのが面倒なJSファイルを見つけるための足の不自由なツリービューがあります。
このオプションは、プロジェクトに小さなJSファイルを含む人に関与している人には影響しない可能性があります。この機能は、スクリプトが1000を超えるJSファイルを超えるときに使用するFireBugでの強打です。
今日はほぼ切り替えを行いましたが、Chromeの変更されたCSSを右クリックして、FireBugでできるようにルールまたはスタイルの宣言をコピーできないことに気付きました。神様、私はFirefoxが突然吸い始めなかったことを願っています。そうしないと、この問題はありません。
Chrome Debuggerを使用すると、GWTプロジェクトのJSNIをデバッグできます。このプロジェクトでは、Firebugが匿名関数を表示するだけで、実際の関数をまったく認識していません。
Chrome Dev Toolが大好きですが、Firebugのこれらの強力な機能を見逃したことがあります。
- 条件付きブレークポイント ：特定の状態でのみ一時停止します。
- ロギング関数呼び出し ：関数をマークし、コンソールで知りたいすべてを表示します。
- プロパティの変更を破る ：マークオブジェクトとデバッガーは、プロパティが変更された場合に一時停止します。
「編集と再送信」リクエスト機能
Firefox Developer Tools（Replay XHRまたはFireBugの何か）の「編集および再送信」機能を使用すると、リクエストヘッダー、リクエストボディ、HTTPメソッド、さらにはURLを含むリクエストの変更でXHRリクエストを再生できます。 Google ChromeのリプレイXHRは、単にリクエストを再生するだけでなく、リクエストの変更を許可しません。
この機能が必要なときにFirefox Devtoolsを使用します。
