CARVIEW |
このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。
PerformanceResourceTiming.domainLookupStart
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2017年9月.
domainLookupStart
は読み取り専用プロパティで、ブラウザーがリソースのドメイン名検索を開始する直前の timestamp
を返します。
値
domainLookupStart
プロパティは以下の値を取ります。
- ブラウザーがリソースのドメイン名検索を始める直前の
DOMHighResTimeStamp
。 - リソースがキャッシュから即座に取得された場合は
0
です。 - リソースがオリジン間リクエストで取得され、HTTP の
Timing-Allow-Origin
レスポンスヘッダーが使用されなかった場合は0
となります。
例
>DNS ルックアップ時間の計測
domainLookupStart
と domainLookupEnd
プロパティを使用すると、 DNS ルックアップの発生に対してどれだけ時間がかかるかを計測することができます。
const dns = entry.domainLookupEnd - entry.domainLookupStart;
PerformanceObserver
を使用した例です。このオブジェクトは、新しい resource
パフォーマンス項目がブラウザーのパフォーマンスタイムラインに記録されると、それを通知します。オブザーバーが作成される前の項目にアクセスするために buffered
オプションを使用します。
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
const dns = entry.domainLookupEnd - entry.domainLookupStart;
if (dns > 0) {
console.log(`${entry.name}: DNS lookup duration: ${dns}ms`);
}
});
});
observer.observe({ type: "resource", buffered: true });
Performance.getEntriesByType()
を使用した例です。このメソッドを呼び出した時点でブラウザー上のパフォーマンスタイムラインに存在する resource
パフォーマンス項目のみを表示します。
const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
const dns = entry.domainLookupEnd - entry.domainLookupStart;
if (dns > 0) {
console.log(`${entry.name}: DNS lookup duration: ${dns}ms`);
}
});
オリジン間のタイミング情報
domainLookupStart
プロパティの値が 0
である場合、そのリソースはオリジン間リクエストである可能性があります。オリジン間のタイミング情報を見るためには、HTTP の Timing-Allow-Origin
レスポンスヘッダーを設定する必要があります。
例えば、https://developer.mozilla.org
にタイミングリソースを見ることを許可するには、オリジン間リソースで次のものを送信する必要があります。
Timing-Allow-Origin: https://developer.mozilla.org
仕様書
Specification |
---|
Resource Timing> # dom-performanceresourcetiming-domainlookupstart> |
ブラウザーの互換性
Loading…