Javascript 计时api中的响应时间
我正在尝试使用计时API测量页面加载性能。首先,我将下面的一段代码包含在html文档的主体中,以检查是否正确获取了所有属性Javascript 计时api中的响应时间,javascript,html,performance,navigation-timing-api,Javascript,Html,Performance,Navigation Timing Api,我正在尝试使用计时API测量页面加载性能。首先,我将下面的一段代码包含在html文档的主体中,以检查是否正确获取了所有属性 <script> window.addEventListener('load', () => { console.log("navigationStart : "+ (performance.timing.navigationStart)); console.log("responseStart : "+ (perfo
<script>
window.addEventListener('load', () => {
console.log("navigationStart : "+ (performance.timing.navigationStart));
console.log("responseStart : "+ (performance.timing.responseStart));
console.log("responseEnd : "+ (performance.timing.responseEnd));
console.log("domComplete : "+ (performance.timing.domComplete));
console.log("loadEventStart : "+ (performance.timing.loadEventStart));
console.log("LoadEventEnd : "+ (performance.timing.loadEventEnd));
});
window.addEventListener('load',()=>{
log(“navigationStart:”+(performance.timening.navigationStart));
log(“responseStart:+(performance.timening.responseStart));
log(“responseEnd:+(performance.timening.responseEnd));
log(“domplete:”+(performance.timening.domplete));
log(“loadEventStart:+(performance.timening.loadEventStart));
log(“LoadEventEnd:+(performance.timening.LoadEventEnd));
});
产量低于
导航开始:1538169000862响应开始:1538169000862
答复:1538169000862
DOMPlete:1538169001831
loadEventStart:1538169001831 LoadEventEnd:0 我想知道为什么LoadEventEnd为零?是因为页面仍在加载吗?那么,捕捉这些指标的最佳时机是什么 编辑:--引入超时后,我能够捕获LoadEvendEnd时间。然而,当我转到下一页时,许多属性现在都为零 导航开始:1538172249035 答复开始:1538172249035 答复:1538172249035 完成日期:0 loadEventStart:0 LoadEventEnd:0
据我所知,此导航位于框架内。是-LoadEventEnd为零,因为页面仍在加载。
您需要在页面加载后执行代码
window.addEventListener('load', loaded)
。。。还不够,因为加载队列尚未完成诀窍是将代码放回事件队列
function loaded() {
setTimeout(nowYouCanDoIt, 0)
}
。。。并检查loadEventEnd是否不再为零:
function nowYouCanDoIt() {
console.log("loadEventEnd: " + performance.getEntriesByType("navigation")[0].loadEventEnd)
}
可能重复:。看看(当前),它参考了规范。谢谢@David。添加超时后,我得到了异常结果。