页面加载时间统计

[better2021]

/**
 * 加载时间统计
 * @returns 
 */

function loadPage(){
  let timer = null;
  let runCheck = ()=>{
      // 既然调用load的时候loadEventEnd会为0
      // 那么就判断，如果值不为0,就调用perfData方法收集性能指标
      if (performance.timing.loadEventEnd) {
          clearTimeout(timer)
              // 页面白屏时间
          const wirteTime = performance.timing.responseStart - performance.timing.navigationStart
          // 页面首屏时间  
          const firstScreenTime = Math.floor(performance.timing.domContentLoadedEventEnd - performance.timeOrigin)
          const pageLoadTime = performance.timing.loadEventEnd - performance.timing.navigationStart;

          const allTime = `页面白屏时间是：${wirteTime}ms , 页面首屏时间是：${firstScreenTime}ms , 页面加载完成时间是：${pageLoadTime}ms`
         console.log(allTime)
      } else {
          // 否则就定时调用runCheck方法，直到loadEventEnd不为0。
          timer = setTimeout(runCheck, 500);
      }
  }
  window.addEventListener('load', runCheck , false)
}

loadPage()