コアポイント
Date.now()
メソッドよりも信頼性の高い正確なパフォーマンス測定オプションを提供します。 Date.now()
をperformance.now()
に置き換えることで、高解像度の時間APIをコードに簡単に統合できます。 今日の世界では、パフォーマンスが重要です。開発者は、ソフトウェアのパフォーマンスを正確に測定できる必要があります。 Web開発に従事している人には、W3Cが確実に時間カウントするための新しいAPIを提供します。これは高解像度の時間APIです。この記事では、高解像度の時間APIを調べて、それを使用する方法を示します。 関数のパフォーマンスを測定するために、JavaScriptメソッドの使用に使用されるWeb開発者。通常、タイミングコードは次のようになります:
Date.now()
var startTime = Date.now(); // 一个耗时的函数 foo(); var test1 = Date.now(); // 另一个耗时的函数 bar(); var test2 = Date.now(); // 打印结果 console.debug("Test1 time: " + (test1 - startTime)); console.debug("Test2 time: " + (test2 - test1));
これは、1つの方法しか含まれていないために読んだ最も簡単なAPIであることを認めなければなりません。このAPIは、ナビゲーションタイミングAPIでも使用されるパフォーマンスインターフェイスを拡張します。聞いたことがない場合は、ナビゲーションタイミングAPI:Pageの読み込みを効果的に分析する方法をご覧ください。露出する唯一の方法は 互換性
)です。 Chromeは、バージョン24から始まる未定のバージョンを使用しているようです。執筆時点では、このAPIをサポートするモバイルブラウザはありません。サポート範囲は広くないため、ブラウザのサポート状況をテストするには最初に機能が必要です。ブラウザがAPIの未定バージョンを使用すると、次の関数が空の文字列を返します。プレフィックスバージョンを使用すると、プレフィックスが返されます。 APIがサポートされていない場合は、nullを返します。
このセクションでは、簡単なデモページをご覧ください。デモは最初にブラウザのサポートをテストし、次に と呼ばれる関数を使用します。 APIに依存している この記事では、高解像度の時間APIが何であるか、どのように使用するかについて説明しました。私が述べたように、それはまだ広くサポートされていないので、Webアプリケーションを正確にテストするためには、しばらく待つ必要があります。ただし、ご覧のとおり、APIには1つの方法しか含まれていないため、APIは非常に簡単です。したがって、ブラウザのサポートが改善されると、高解像度の時間への移行は迅速かつ簡単になります。
(質問要件と一致せず、長すぎるため、FAQの部分はここで省略されています) 以上が高解像度時間APIの発見の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。Date.now()
高解像度時間API <
now()
であり、これはDOMHighResTimeStamp
を返し、現在の時間をミリ秒単位で示します。タイムスタンプは非常に正確で、1000分の1ミリ秒の精度があります。 1970年1月1日の00:00:00 UTC以降に経過したミリ秒数をDate.now()
に戻しますが、performance.now()
(ドキュメントナビゲーションが開始)から呼び出されたミリ秒数をperformance.timing.navigationStart()
に戻すことに注意してください。分数部分はマイクロ秒です。 performance.now()
とDate.now()
のもう1つの重要な違いは、後者が単調に増加しているため、2つの呼び出しの違いが負のものではないことです。多分あなたは、高解像度の時間APIがあなたのコードをどのように変更するのか疑問に思っています。良いニュースは、何も変わらないということです。 performance.now()
をDate.now()
に置き換えるだけで、測定の精度を向上させることができます。これを念頭に置いて、以前のコードは次のように書き換えられます:performance.now()
var startTime = Date.now();
// 一个耗时的函数
foo();
var test1 = Date.now();
// 另一个耗时的函数
bar();
var test2 = Date.now();
// 打印结果
console.debug("Test1 time: " + (test1 - startTime));
console.debug("Test2 time: " + (test2 - test1));
performance.webkitNow()
var startTime = performance.now();
// 一个耗时的函数
foo();
var test1 = performance.now();
// 另一个耗时的函数
bar();
var test2 = performance.now();
// 打印更精确的结果
console.debug("Test1 time: " + (test1 - startTime));
console.debug("Test2 time: " + (test2 - test1));
Date.getTime()
function getPrefix() {
var prefix = null;
if (window.performance !== undefined) {
if (window.performance.now !== undefined)
prefix = "";
else {
var browserPrefixes = ["webkit","moz","ms","o"];
// 测试所有厂商前缀
for(var i = 0; i < browserPrefixes.length; i++) {
if (window.performance[browserPrefixes[i] + "Now"] != undefined) {
prefix = browserPrefixes[i];
break;
}
}
}
}
return prefix;
}
doBenchmark
関数を導入したことに注意してください。その唯一の目的は、不必要な複製を避け、コードをより簡潔にすることです。デモンストレーションのソースコードは次のとおりです。(質問要件と一致せず、長すぎるため、長いサンプルコードはここで省略されています)performance.now()
getTime()