js 监控浏览器性能
查看性能的参数说明:
var t = performance.timing; // 详情参见 performance API。
(1). 白屏时间 -> css加载完成时间戳 - t.fetchStart
(2). 首屏/用户可操作时间 -> t.domContentLoadedEventEnd - t.fetchStart
(3). 总下载时间 -> t.domComplete - t.fetchStart
(4). 各阶段耗时
- 获取html请求 -> t.responseStart - t.fetchStart
- 获取html全部字节 -> t.responseEnd - t.responseStart
- 解析初始html节点 -> 最后一个js请求发送时间戳 - t.domLoading
- css加载 -> 加载全部css时间
- js加载 -> 加载全部js时间
- 解析html+下载解析css,js -> t.domContentLoadedEventStart - t.domLoading
- js执行(domready中代码) -> t.domContentLoadedEventEnd - t.domContentLoadedEventStart
(5). Ajax
var lastTime = onload事件触发前发送的请求得到响应时间戳;
- 加载页面 至 获得请求 -> lastTime - t.fetchStart
- 请求耗时 -> lastTime - 发送第一个请求的时间戳
- 请求数量 -> onload事件触发前发送的请求数
- 使用本地存储 -> onload事件触发前发送的请求,是否包含 useCache:true