首屏性能优化

performance API

前端打点

performance.timing 需记录时间:

Performance.timing.navigationStart: 开始导航到当前页面的时间,即在地址栏输入地址后按下回车时的时间

performance.timing.fetchStart: 开始通过HTTP GET取得页面的时间

DNS/ Lookupfordomain

domainLookupStart: 开始査询当前页面DNS的时间,如果使用了本地缓存或持久连接,则与fetchStart值相等
domainLookupEnd: 査询当前页面DNS结束的时间,如果使用了本地缓存或持久连接,则与fetchStart值相等

CONNECT、SSL

connectStart: 浏览器尝试连接服务器的时间
secureConnectionStart: 浏览器尝试以SSL方式连接服务器的时间。不使用SSL方式连接时,这个属性的值为0
connectEnd: 浏览器成功连接到服务器的时间

TTFB

requestStart: 浏览器开始请求页面的时间
responseStart: 浏览器接收到页面第一字节的时间

*responseEnd:浏览器接收到页面所有内容的时间

https://www.cnblogs.com/xiaohuochai/p/6523397.html
http://www.alloyteam.com/2012/11/performance-api-monitoring-page-performance/

https://tech.meituan.com/WebViewPerf.html?utm_source=tool.lu


后续跟进

  • https://developers.google.com/web/fundamentals/performance/user-centric-performance-metrics?hl=zh-cn
  • https://juejin.im/post/5dd4a0de5188254f98605ff9
  • https://w3c.github.io/longtasks/

你可能感兴趣的:(首屏性能优化)