web-dev-qa-db-ja.com

コンピューターのUIラグを測定する方法は?

特定のコンピューターで実行されている特定のアプリケーションのUIラグの測定に役立つツールはありますか?

UIの「高速」化に関するガイドラインはたくさんありますが、どのように測定できますか?

説明:デスクトップPCを使用しています。これはモバイル指向ではありません。

説明2:これは、従来のアプリケーションプログラムの場合です。 Webアプリではありません。 (昔ながらのような、私は知っています。)

16
nonot1

UIの「高速」化に関するガイドラインはたくさんありますが、どのように測定できますか?

これはおそらく言うまでもありませんが、UIの待機時間を測定する方法は、UIのアクションまたはイベントが開始したときと完了したときの差を取ることです。これは、プログラムでこれらの時間を手動で記録するか、またはアクションを開始する直前にタイムスタンプを取得し、アクションが完了した直後にタイムスタンプを取得して、それらの差を取得することにより、非プログラムで実行できます。その時間差は、そのアクションに対するアプリケーションのUIレイテンシです。

UIフローを構成する一連のアクションに対してこれらの測定を行い、代表的なUIフローのセットに対してそれを行うと、アプリケーションのUIレイテンシの高レベルの状況がわかります。

特定のコンピューターで実行されている特定のアプリケーションのUIラグを測定するのに役立つツールはありますか?

はい。ユーザーインターフェースのレイテンシは、マシン全体のさまざまなサブシステム(ネットワーク、ファイルI/O、CPU、メモリなど)のレイテンシの合計です。UIレイテンシは高レベルで測定できますが、低レベルでも測定できますこれらのコンポーネントの1つでレイテンシを調べることによって。

以下は、さまざまなタイプのアプリケーションのUIレイテンシを高レベルまたはコンポーネントレベルで測定および分析するために使用できる特定のツールとテクニックです。

デスクトップアプリケーション

UIのレイテンシの大まかな測定値を探しているだけで、ビデオ再生を試しても問題がなく、1回または数回の試行で十分である場合は、最初に次のようなUIフロー再生ソリューションを調べます。 MelとBen Brockaによるあなたの質問に this answer で提案されたもの。 Camtasiaオプションは、このユースケースで有望に聞こえます。

UIレイテンシの正確な測定、それらの測定における高速かつ自動の再現性、およびそのUIレイテンシの迅速で堅牢なレポートを作成するオプションを探している場合(and時間と技術的背景/傾向がある場合)、OSレベルの自動化ソリューションを検討する価値があります。 AutoIt は、Windowsで人気のある自動化フレームワークです。 AppleScript/AppleScript GUI Scripting は、Macに最も近いものと思われます。

AutoItまたはAppleScriptの基本的なアプローチは、他のプログラムによるレイテンシ測定と同じです。アクションを開始する直前にタイムスタンプを取得し、アクションが完了した直後にタイムスタンプを取得します。これら2つの違いは、UIレイテンシです。

たぶん、このアプローチはあなたのニーズにとっては行き過ぎかもしれませんし、そうでないかもしれません。質問の範囲はかなり広いです。

ネットワークを介して通信するアプリケーション

多くの場合、ネットワークレイテンシはユーザーインターフェイスのレイテンシにつながります。多くのアプリケーションは、OSネイティブであるかブラウザ用に構築されているかに関係なく、HTTPまたはその他のネットワークプロトコルを使用してメッセージを送受信します。

Wireshark マシンとの間のすべてのネットワークトラフィック(HTTPトラフィックを含む)をキャプチャし、それを分析する機能があります。アプリケーションがWebブラウザーで実行されておらず、UIレイテンシへのネットワークの寄与を分離したい場合は、これはおそらく詳細な分析に最適です。

Charles Proxy および(Windowsの場合) Fiddler は、HTTP/HTTPSトラフィックのネットワーク遅延分析に役立つブラウザーに依存しないツールでもあります。

グラフィックスが多いアプリケーション

2Dおよび3Dグラフィックスを実質的に使用するアプリケーションは、ネイティブレベルで明らかに人気があり、Webブラウザーベースのグラフィックスアプリケーションも人気があります(Flashが支配的ですが衰退しており、HTML5 CanvasおよびWebGLはあまり人気がありませんが増加しています)。これらのアプリケーションでのUIラグの主な測定基準は フレームレート (フレーム/秒、FPS)です。多くのグラフィックスを多用するアプリケーションには、特別なツールを必要とせずにこの測定値をユーザーに公開する機能があります。

ウェブ上で

内部で実行されるWebブラウザーおよびWebサイト/アプリケーションは、「特定のコンピューターで実行される特定のアプリケーション」の大部分を表しています。

Web上のレイテンシを測定するための最良のツールの1つは、ブラウザのネットワークトラフィックのウォーターフォール図です。これは、Firefoxの Firebug 拡張機能の「ネット」パネル、Chromeおよび(歯車アイコン)->ツール->開発者ツール->ネットワークのSafari)で利用できます。 (歯車のアイコン)のInternet Explorer 9-> F12開発者ツール->ネットワーク(キャプチャを開始) この質問 Stackoverflowとその回答は、ネットワークトラフィックのウォーターフォール図の解釈方法の概要を示します。 、少なくともFirebugとChromeでは、これらのウォーターフォール図をエクスポートして保存し、後で分析することができます。

WebPagetest.org の無料サービスは、待ち時間を測定するもう1つの優れた方法です。URLを入力するだけで、パフォーマンス結果を取得できます。このツールは、数多くの優れた機能を提供します。テスト結果の各セットは独自のURLを取得するため、それらにリンクしたり、ブックマークしたりできます。 ChromeおよびFirebugが利用可能にする)と同じ形式で結果をエクスポートすることもできます。おそらく最も重要なこととして、さまざまな異なるブラウザタイプ、接続速度、およびグローブ。

また、WebサイトまたはWebアプリケーションの開発者であれば、Navigation Timing APIを使用して、ページ遷移中のエンドツーエンドのUIレイテンシを分析することもできます( W3C仕様詳細ドキュメントブラウザサポートマトリックス )。これらのレイテンシ測定値は、広範囲のユーザーに対して記録され、全体で分析されて、すべてのユーザーのパフォーマンスの適切な概要を取得します。

ページ読み込みレイテンシ(UIレイテンシの一種)とWeb上のパフォーマンスに関するいくつかの集計データについては、Steve Souderの HTTP Archive が適切なリソースです。

上記のツールとリソースは、ネットワークトラフィックによるレイテンシ、特にページの読み込み時間の測定と分析に役立ちます。これは通常、Webアプリケーションの遅延の最大の原因です。

ネットワーク待機時間とサーバーでの待機時間(独自の待機時間測定手法が含まれる)の後、非パフォーマンスJavaScriptは、UIの応答性を遅くしたり、WebアプリケーションのUI待機時間を増やしたりする可能性もあります。開発したWebアプリケーションを分析する場合、JavaScriptのパフォーマンスは、FirefoxのFirebug拡張機能やChromeの開発者ツールなどのツールを使用して、分析するコードをconsole.profile()およびconsole.profileEnd()(詳細情報 here および here )。

7
jqp

はい。自動化フレームワークは、対話と応答の間の時間を測定できます。数百回の試行の結果をログファイルに出力できるため、グラフや表に簡単に変換できます。 Webでは、多数の言語バインディングとその一連のテストツールのおかげで、最も一般的な選択はおそらくSeleniumです。実際、より一般的な一連の回帰テストにUIパフォーマンスチェックを組み込むことができるはずです。

ただし、パフォーマンステストは一見単純そうに見える場合があるので注意してください。 UIはさまざまな状況でさまざまに変化し、緊張するため、テストシナリオと試行回数の選択は非常に徹底する必要があります。

5

使用するプラットフォームとソフトウェアに応じて、ソフトウェア内からプログラムで時間を測定するか、特定の相互作用を記録してビデオ出力を測定することができます。

後者の場合は、単純な画面記録ソフトウェアがうまく機能します。クローズドプラットフォームまたはモバイルプラットフォームで作業している場合は、実際のカメラでの記録が必要になる場合があります。記録は使いやすさのテストによく使用されるため、 この種類の機器 はすでに利用可能である可能性があります。

その後、ビデオ編集ソフトウェア内から何でも測定できます。

2
Mel