問題タブ [navigation-timing-api]

動的コンテンツが loadEnd などのタイミング値に影響を与えるかどうかを知りたいです。たとえば、ページを読み込んだ後、jquery を使用してコード内の画像の 'src' 属性を条件付きで変更します。これはどのように処理されますか？画像をロードする前後の値を確認してテストしてみましたが、この画像がロードされた後に値が変化するようには見えません。これは、Navigation Timing API に動的コンテンツの読み込みが含まれていないということですか?

Web Performance API を使用する Web ベースのページ レンダリング ベンチマーク アプリを構築しています。基本的には、ブラウザーが一連の div 要素をレンダリングするように命令されたときにかかる時間を測定してから、非表示のフォームを作成し、計算結果をそこに入れ、フォームを処理のために別の PHP ページに送信します。問題は、計算結果が常に負になり、数兆の範囲 (つまり、14 桁の数字: -1364403484035) になることです。コードは次のとおりです。

更新 1:

次のように、コードを微調整しました。

ブラウザの JavaScript コンソールを使用して変数の値を調べたところ、ending = 0

Navigation Timing API のドキュメントによると、ドキュメント全体が解析されると DOM Interactive がトリガーされます。ResponseEnd は、応答の最後のバイトが受信されるとトリガーされます。私たちの実世界のデータ (私のサイトへの訪問者) を見ると、主に Internet Explorer 9 以降で、DOM Interactive イベントが Response End イベントの前に発生するケースが多数見られました。何かご意見は？

Navigation Timing API を使用して、次のような基本的なネットワーク パフォーマンス測定値を収集しています。

1. Domain Aのページから、Domain Bの別のページをダウンロードする DOM に iframe を挿入し、長いランダム クエリ文字列をDomain BのURL に適用してキャッシュを無効化します。

2. ドメイン B ページの JavaScript は数秒待機してから、window.performance.timing の内容を読み取ります。

数値は、1 つのことを除いて予想どおりに見えます: connectEnd はほとんどの場合、connectStart と同じです。何が起こっているのかを誤解していない限り、持続的な接続は行われず、ブラウザはドメイン Bのドキュメントをキャッシュから取得するべきではありません。したがって、ブラウザはDomain Bへの新しい接続を確立する必要があり、 connectEnd から connectStart を引いた値は、そのためにかかる時間を反映する必要があります。

これを Firefox、Chrome、IE (IE 10) でテストしました。Firefox と IE では、connectEnd が connectStart に等しいことしか確認できませんでした。それらは一般的にChromeでも同じですが、connectEndがconnectStartよりも大きいことが1回見られました。

テスト ページはhttp://test-pages.s3.amazonaws.com/test-navtiming.htmlで入手でき、http://www.wildlemur.com/files/navtiming.html で別のテスト ページをダウンロードします(さらにランダムクエリ文字列）。connectStart と connectEnd の値がブラウザ コンソールに表示されます。

このシナリオで、connectEnd が connectStart と同じになることが多い理由は何ですか?

このオブジェクトを使用してNavigationTiming、Web サイトのパフォーマンスを監視しています。

オブジェクトのredirectStartプロパティに関する W3C ドキュメントによると:NavigationTiming

ナビゲート時に HTTP リダイレクトまたは同等のものがあり、すべてのリダイレクトまたは同等のリダイレクトが同じオリジンからのものである場合、この属性は、リダイレクトを開始するフェッチの開始時刻を返す必要があります。

私のサイトには現在ログイン ページがあり、POST を送信し、ウェルカム ページへの 302 リダイレクトを受け取ります。NavigationTimingウェルカム ページのオブジェクトにredirectStartとredirectEndプロパティが含まれていると思っていましたが、それらは 0 です。

そうでない場合、いつデータを入力する必要がありますか?

サーバーからページを受信して​​からページの読み込みにかかった時間をカウントしたいので、残りのloadEventEndとresponseEndを使用します。

しかし、私のコードではJSONPテクノロジも使用しており、「get 関数getJson()」を使用すると、loadEventEnd は 0 を返します。

必要に応じて、Navigation Timing API を使用して大きなリソースを提供したいと考えています。1 つの問題は、それをサポートしていない Safari です。

次のコードが期待どおりに機能しないケースを示してください。

API のサポートを検出すると、いくつかのフォールバックがあります。残念ながら、古いバージョンの IE とデスクトップ Safari に大きなリソースを提供するために、UA スニッフィングを行う必要があります。

ブラウザがこれらの条件のいずれも満たさない場合、それは iPhone 上のモバイル Safari または古いバージョンの Android であり、モバイル ファーストのリソースを提供することを余儀なくされます。

さあ、TEAR ME A NEW ONE. これがひどいアプローチである場合、私は本当に知りたいです。

私が今見ている唯一の問題は、JS を使用しないデスクトップ サイトはモバイル リソースを取得することです。