Mozillaは今週、FirefoxDevToolsの新しいアップデートを発表しました。 コンピューターまたはモバイルデバイスでHTML、CSS、およびJavaScriptを調べ、変更し、デバッグするための開発ツール。
Firefox DevToolsチームが発表したアップデート、 主にFirefoxDevToolsを使用したデバッグを参照してください また、特に最新のWebアプリケーションの構築において、開発者により高い信頼性とパフォーマンスをもたらすことを目指しています。
この新しいアップデートで、 Mozillaは、Firefox67以上のユーザーに確かなデバッグ体験を約束しました。
スクリプトのデバッグは、DevToolsの最も強力で複雑な生産性機能のXNUMXつです。
Firefox67用のFirefoxDevToolsの更新バージョンにより、開発者はデバッグプロセスの速度と信頼性を高め、パフォーマンスを向上させることができます。
Firefox DevToolsの新機能は何ですか？
Firefox DevToolsチームによると、l新しいDevTools機能は、XNUMXつの重要なポイントを中心に展開します。 含む
- 最速の充電時間
- 改造されたソースマップのサポート
- デバッガーがターゲットになっていない場合のオーバーヘッドの削減
- ブレークポイントの欠落、誤ったスクリプト割り込みなどに関連するいくつかの問題を修正しました。
DevTools Firefoxを開くのが30％速く
デバッガーのオープン時間は、以前のバージョンより30％速くなりました。 DevToolsFirefoxチームは次のように説明しています 彼らはデバッガーが引き起こした最悪のパフォーマンスを取り除きました ゆっくり開いて、 これは、パフォーマンステストの後で、デバッガーが30％高速になったことを示しています。
改善されたソースマップ
それからチームは言った 改良されたより高速なソースマップソース Babel、Webpack、TypeScript、view.jsなどのコンパイル済み出力ではなく、コードをデバッグしているように見せかけます。
ソースマップは、デバッガーが実行されたコードを元のソースファイルにリンクできるファイルであり、ブラウザーが元のソースを再構築してデバッガーに表示できるようにします。
エコシステム全体の利益のためにツール（Babel、Vue.jsなど）を開発したチームは、正しいマップソースを生成するのは難しい場合があると説明しました。
より高速なソースマップのサポート（およびその他の追加作業）により、実行が一時停止しているときに変数にカーソルを合わせると、プレビューがはるかに高速に表示されるようになりました。
さらに、 マップソースをBabelパーサーと組み合わせることにより、 Firefoxデバッガー 今、あなたはあなたの興味のある元の変数をプレビューすることができます コンパイラやパッケージから不要な情報を隠します。
コンソール上でも機能し、フレンドリIDをバックグラウンドで実際の詳細な名前に自動的に解決します。 そのパフォーマンスのため、デバッガーの「スコープ」ペインの「マップ」ボックスをチェックして、この機能を個別に有効にする必要があります。
それ以外、 このFirefoxDevToolsアップデートでは、デバッガアーキテクチャの長年のバグの多くが修正されています。 ブレークポイントの欠落や間違ったスクリプトへの侵入に関連する最も一般的で苛立たしい問題のいくつかを解決します。
このツールは、JavaScript開発者がより透過的にデバッグできるように拡張されています。
同様に、DevTools Firefoxチームが説明したように、今日のWeb開発者は最新のWebを使用しており、DevToolsのワールドクラスの概念から利益を得ることができるはずです。
新しいスレッドパネルを使用すると、異なる実行コンテキストを切り替えて、それらを個別に一時停止できます。 これにより、他の最新のブラウザーと同じ方法で、同じデバッガーパネルでスクリプトをデバッグできます。
とはいえ、FirefoxのWeb開発ツールはまだChromeに遅れをとっていると考える人もいます。
彼らによると、Webソケットのデバッグなど、ChromeDevToolsに表示されるFirefoxDevToolsの一部の機能はまだ不足しています。
Chrome DevToolsは、GoogleChromeブラウザに直接統合された一連のWeb開発ツールであることを忘れないでください。