BT

InfoQ ホームページ ニュース MozillaはFirefox Developer EditionのCSSアニメーションインスペクタをメジャーアップデートリリースした

MozillaはFirefox Developer EditionのCSSアニメーションインスペクタをメジャーアップデートリリースした

ブックマーク

原文(投稿日:2015/05/26)へのリンク

Mozillaは、常にアクティブなネットワーク監視およびCSS ルールフィルタリングを実装したFirefox Developer Editionの最新アップデートをリリースした。

Mozilla HacksのDeveloper Edition 40に関する記事において、エンジニアのBrian Grinstead氏は、開発者コミュニティからの「フィードバックに対応するために開発ツールコントリビューターが大きな努力をした」と言った。

Cleanwebの共同創業者Chris Adams氏は、Firefox Developer Toolsのフィードバックチャネルにコミュニティから200以上の票を受けるアイディアであるネットワークパネルを「常にアクティブ」にする提案をした。Adams氏は次のように提案した:

リクエストされた時にネットワークパネルがアクティブではないため、ほぼ毎回、私はネットワークパネルを開いて、最初にページをリロードする必要があります。彼らが激しいAJAXページにおけるメモリ使用量を気にしているのだとすれば、ネットワークパネルで使用しようとするタスクの大半は、Resource Timing APIに存在する情報レベルで十分であると理解しています。

バグは解消されたが、FirefoxエンジニアPanos Astitha氏は、プラットフォームをまたいでツールボックスが開くまでの時間がおよそ15%増加したと開発者ノートコメントした。

彼は「私たちはパフォーマンスを改善する方法を模索する必要があるが、この変更は明らかにツールボックスを開いた時のイベントを以前より増やしているため、劣化は想定通りです。」と言った。しかしながらFirefoxは、改善されたワークフロー、ネットワークパネルの修正、またその他の関連しない改善によって、ユーザーの全体的なエクスペリエンスが高速化することを期待している。

また、アニメーションインスペクターへの「メジャーアップデート」として、AnimationsActorは、指定されたノード下のすべてのアニメーションを返す必要があるAnimationsActor.getAnimationPlayersForNodeメソッドへの変更を必要であった。関連するものとして、アニメーション対象DOMノードは、アニメーションパネルでプレビューする必要があるアップデートがある。

FirefoxエンジニアリングのディレクターであるDave Camp氏は、これらの変更は開発者が、ひとつの効果を与えるために複数のWebアニメーションを組み合わせることが一般的であると考え、選択したノードと子ノードのすべてのCSSアニメーションを見えることができるようになる。とInfoQに語った。たとえば、Ana TudorのCSSのみのアニメーションデモで見ることができる。

アニメーションインスペクタパネルに再生速度の選択を追加する更新でCSSの改善を続け、ゴールは「開発者が望むアニメーションの‘感覚’を決定するプロセスの一部として、アニメーションのスローダウンとスピードアップ」であるとCamp氏は言う。

Developer Editionのアップデートは、コミュニティに受け入れられており、リリースに対するユーザーのコメントでは、「chromeツールの開発者はすでにこれらの多くを持っていて、さらによくないですか?」と尋ねた

ユーザーKamal Bhatt氏は、「私はChromeを毎日使ってはいないがそれは厳しいかもしれなく、問題のデバッグするためにこれを使うとき、Chromeツールには不足しているものがありました。Firefoxのプロファイルツールは少し良く、JSエラーメッセージはFirefoxの方がかなり優れています。JSコードを意図的にブレークしてその違いを見てみてください。このリリースは、Firebugのスイッチをオフにするものだと思います。」と返信した

Camp氏は、Firefoxチームは「CSSとHTMLのインスペクション、コンソールやネットワークモニター、デバッグを通じたロギングとモニタリングというコアユースケースにフォーカス」しており、彼らはWebサイトのパフォーマンス問題の診断周りの機能、WebGL, Web Audio, Web Animationsを含めた新しいWebプラットフォーム機能周辺の革新の改善に取り組んでいるとInfoQに語った。

この記事に星をつける

おすすめ度
スタイル

こんにちは

コメントするには InfoQアカウントの登録 または が必要です。InfoQ に登録するとさまざまなことができます。

アカウント登録をしてInfoQをお楽しみください。

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

コミュニティコメント

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

BT

あなたのプロファイルは最新ですか?プロフィールを確認してアップデートしてください。

Eメールを変更すると確認のメールが配信されます。

会社名:
役職:
組織規模:
国:
都道府県:
新しいメールアドレスに確認用のメールを送信します。このポップアップ画面は自動的に閉じられます。