performance api

1. DNS 解析耗时: domainLookupEnd - domainLookupStart
2. TCP 连接耗时: connectEnd - connectStart
3. SSL 安全连接耗时: connectEnd - secureConnectionStart
4. 网络请求耗时 (TTFB): responseStart - requestStart
5. 数据传输耗时: responseEnd - responseStart
6. DOM 解析耗时: domInteractive - responseEnd
7. 资源加载耗时: loadEventStart - domContentLoadedEventEnd
8. First Byte时间: responseStart - domainLookupStart
9. 白屏时间: responseEnd - fetchStart
10. 首次可交互时间: domInteractive - fetchStart
11. DOM Ready 时间: domContentLoadEventEnd - fetchStart
12. 页面完全加载时间: loadEventStart - fetchStart
13. http 头部大小： transferSize - encodedBodySize
14. 重定向次数：performance.navigation.redirectCount
15. 重定向耗时: redirectEnd - redirectStart

切换tab，判断当前tab是否隐藏

let vEvent = 'visibilitychange';
if(document.webkitHidden !== undefined){
  vEvent = 'webkitvisibilitychange';
}
function visibilityChanged(){
  if(document.hidden || document.webkitHidden){
    console.info('page is hidden')
  }else{
    console.info('page is visible');
  }
}
document.addEventListener(vEvent,visibilityChanged);

判断用户网络状态：根据用户的网络状态有针对性的进行加载

let connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
let type = connction.effectiveType;
//网络变化监听函数
connction.addEventListener('change',connectionchange);

参考： blog.csdn.net/weixin_4413… www.jianshu.com/p/d476bd527…