摘要:如果沒有前一個網頁,則等于屬性。該事件在網頁查詢本地緩存之前發生。如果使用持久連接,則返回值等同于屬性的值。返回當前網頁結構生成時即屬性變為,以及相應的事件發生時的毫秒時間戳。
window.performance.timing下的屬性
</>復制代碼
navigationStart
當前瀏覽器窗口的前一個網頁關閉,發生unload事件時的Unix毫秒時間戳。如果沒有前一個網頁,則等于fetchStart屬性。
</>復制代碼
unloadEventStart
如果前一個網頁與當前網頁屬于同一個域名,則返回前一個網頁的unload事件發生時的Unix毫秒時間戳。如果沒有前一個網頁,或者之前的網頁跳轉不是在同一個域名內,則返回值為0;
</>復制代碼
unloadEventEnd
如果前一個網頁與當前網頁屬于同一個域名,則返回前一個網頁unload事件的回調函數結束時的Unix毫秒時間戳。如果沒有前一個網頁,或者之前的網頁跳轉不是在同一個域名內,則返回值為0。
</>復制代碼
redirectStart
返回第一個HTTP跳轉開始時的Unix毫秒時間戳。如果沒有跳轉,或者不是同一個域名內部的跳轉,則返回值為0。
</>復制代碼
redirectEnd
返回最后一個HTTP跳轉結束時(即跳轉回應的最后一個字節接受完成時)的Unix毫秒時間戳。如果沒有跳轉,或者不是同一個域名內部的跳轉,則返回值為0。
</>復制代碼
fetchStart
返回瀏覽器準備使用HTTP請求讀取文檔時的Unix毫秒時間戳。該事件在網頁查詢本地緩存之前發生。
</>復制代碼
domainLookupStart
返回域名查詢開始時的Unix毫秒時間戳。如果使用持久連接,或者信息是從本地緩存獲取的,則返回值等同于fetchStart屬性的值。
</>復制代碼
domainLookupEnd
回域名查詢結束時的Unix毫秒時間戳。如果使用持久連接,或者信息是從本地緩存獲取的,則返回值等同于fetchStart屬性的值。
</>復制代碼
connectStart
返回HTTP請求開始向服務器發送時的Unix毫秒時間戳。如果使用持久連接(persistent connection),則返回值等同于fetchStart屬性的值。
</>復制代碼
connectEnd
返回瀏覽器與服務器之間的連接建立時的Unix毫秒時間戳。如果建立的是持久連接,則返回值等同于fetchStart屬性的值。連接建立指的是所有握手和認證過程全部結束
</>復制代碼
secureConnectionStart
返回瀏覽器與服務器開始安全鏈接的握手時的Unix毫秒時間戳。如果當前網頁不要求安全連接,則返回0。
</>復制代碼
requestStart
返回瀏覽器向服務器發出HTTP請求時(或開始讀取本地緩存時)的Unix毫秒時間戳。
</>復制代碼
responseStart
返回瀏覽器從服務器收到(或從本地緩存讀取)最后一個字節時(如果在此之前HTTP連接已經關閉,則返回關閉時)的Unix毫秒時間戳
</>復制代碼
domLoading
返回當前網頁DOM結構開始解析時(即Document.readyState屬性變為“loading”、相應的readystatechange事件觸發時)的Unix毫秒時間戳。
</>復制代碼
domInteractive
返回當前網頁DOM結構結束解析、開始加載內嵌資源時(即Document.readyState屬性變為“interactive”、相應的readystatechange事件觸發時)的Unix毫秒時間戳。
</>復制代碼
domContentLoadedEventStart
返回當前網頁DOMContentLoaded事件發生時(即DOM結構解析完畢、所有腳本開始運行時)的Unix毫秒時間戳。
</>復制代碼
domContentLoadedEventEnd
返回當前網頁所有需要執行的腳本執行完成時的Unix毫秒時間戳。
</>復制代碼
domComplete
返回當前網頁DOM結構生成時(即Document.readyState屬性變為“complete”,以及相應的readystatechange事件發生時)的Unix毫秒時間戳。
</>復制代碼
loadEventStart
返回當前網頁load事件的回調函數開始時的Unix毫秒時間戳。如果該事件還沒有發生,返回0。
</>復制代碼
loadEventEnd
返回當前網頁load事件的回調函數運行結束時的Unix毫秒時間戳。如果該事件還沒有發生,返回0。
如何分析頁面整體加載速度</>復制代碼
一般頁面統計所需要的參數(dom解析時間,domContentLoaded時間,onload時間, 白屏時間,getStyleConfig接口返回時間 - 準備加載新頁面的起始時間)
</>復制代碼
let pt = window.performance.timing;
/* dom解析時間
*
*
*1.domComplete
*當前網頁DOM結構生成時(即Document.readyState屬性變為“complete”,以及相應的
*readystatechange事件發生時)的Unix毫秒時間戳
*
*2.domInteractive
*當前網頁DOM結構結束解析、開始加載內嵌資源時
*即Document.readyState屬性變為“interactive”、相應的readystatechange事件觸發時
*的Unix毫秒時間戳。
*/
let domComplete = pt.domComplete - pt.domInteractive;
/* domContentLoaded時間
*
*
*當前網頁DOM結構生成時(即Document.readyState屬性變為“complete”,以及相應的
*1.domContentLoadedEventEnd
*網頁DOMContentLoaded事件發生時(即DOM結構解析完畢、所有腳本開始運行時)的Unix毫秒時間
*戳。
*
*2.navigationStart
*當前瀏覽器窗口的前一個網頁關閉,發生unload事件時的Unix毫秒時間戳。
*如果沒有前一個網頁,則等于fetchStart屬性
*/
let domLoaded = pt.domContentLoadedEventEnd - pt.navigationStart;
/* onload時間
*1.loadEventEnd
*當前網頁load事件的回調函數運行結束時的Unix毫秒時間戳。如果該事件還沒有發生,返回0。
*/
let onload = pt.loadEventEnd - pt.navigationStart;
// 白屏時間,getStyleConfig接口返回時間 - 準備加載新頁面的起始時間
let white = window.dbStyleConfigEnd ? window.dbStyleConfigEnd - pt.navigationStart : "";
let dbStyle = window.dbStyleConfigEnd - window.dbStyleConfigStart;
let url = `/statistics/activityPagePerf?hdType=${CFG.appName}&oaId=${CFG.actId}&domComplete=${domComplete}&domLoaded=${domLoaded}&onload=${onload}&white=${white}&dbStyle=${dbStyle}`;
主要是查看指標值PAGET_頁面加載時間,此指標指的是頁面整體加載時間但不含(onload事件和redirect), 此指標值可直接反應用戶體驗, 從此項指標可以知道指定某時間段的頁面加載速度值,以及和天,周,月的對比狀況.
也可以查詢指標ALLT_頁面完全加載時間, 可以查詢到從瀏覽器開始導航(用戶點擊鏈接或在地址欄輸入url或點刷新,后退按鈕)到頁面onload 事件js完全跑完的所有時間.
</>復制代碼
如果發現頁面加載速度有增加或減少,則可以分項查詢前面的每個指標值,總的來說他們的關系如下:
1.dom開始加載前所有花費時間=重定向時間+域名解析時間+建立連接花費時間+請求花費時間+接收數據花費時間
2.pageLoadTime頁面加載時間=域名解析時間+建立連接花費時間+請求花費時間+接收數據花費時間+解析dom花費時間+加載dom花費時間
3.allLoadTime頁面完全加載時間=重定向時間+域名解析時間+建立連接花費時間+請求花費時間+接收數據花費時間+解析dom花費時間+加載dom花費時間+執行onload事件花費時間
4.resourcesLoadedTime資源加載時間=解析dom花費時間+加載dom花費時間
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/50881.html
摘要:如果沒有前一個網頁,則等于屬性。該事件在網頁查詢本地緩存之前發生。如果使用持久連接,則返回值等同于屬性的值。返回當前網頁結構生成時即屬性變為,以及相應的事件發生時的毫秒時間戳。 window.performance.timing下的屬性 navigationStart 當前瀏覽器窗口的前一個網頁關閉,發生unload事件時的Unix毫秒時間戳。如果沒有前一個網頁,則等于fetchSta...
摘要:如果沒有前一個網頁,則等于屬性。該事件在網頁查詢本地緩存之前發生。如果使用持久連接,則返回值等同于屬性的值。返回當前網頁結構生成時即屬性變為,以及相應的事件發生時的毫秒時間戳。 window.performance.timing下的屬性 navigationStart 當前瀏覽器窗口的前一個網頁關閉,發生unload事件時的Unix毫秒時間戳。如果沒有前一個網頁,則等于fetchSta...
摘要:性能時間線以一個統一的接口獲取由和所收集的性能數據。瀏覽器支持下表列舉了當前主流瀏覽器對性能的支持,其中標注星號的內容并非來自于性能工作小組。 頁面的性能問題一直是產品開發過程中的重要一環,很多公司也一直在使用各種方式監控產品的頁面性能。從控制臺工具、Fiddler抓包工具,到使用DOMContentLoaded和document.onreadystatechange這種侵入式java...
摘要:連接建立指的是所有握手和認證過程全部結束。發生錯誤的腳本字符串發生錯誤的行號數字發生錯誤的列號數字對象對象若該函數返回,則阻止執行默認事件處理函數。在某些瀏覽器中,通過在使用屬性并要求服務器發送適當的響應頭,該行為可被覆蓋。 1.頁面整體性能 通過瀏覽器提供的 window.performance.timing 方法,我們能夠得到網頁每個處理階段的精確時間。打開一個頁面后,這些信息會被...
閱讀 2293·2021-11-16 11:51
閱讀 3510·2021-09-26 10:14
閱讀 1835·2021-09-22 15:58
閱讀 1101·2019-08-30 15:52
閱讀 2019·2019-08-30 15:43
閱讀 2619·2019-08-30 13:46
閱讀 914·2019-08-30 13:10
閱讀 1025·2019-08-29 18:32
极致性价比!云服务器续费无忧!
Tesla A100/A800、Tesla V100S等多种GPU云主机特惠2折起,不限台数,续费同价。
NVIDIA RTX 40系,高性价比推理显卡,满足AI应用场景需要。
乌兰察布+上海青浦,满足东推西训AI场景需要