Question

是否可以使用jQuery / Javascript计算页面的估计加载时间？

我已经尝试了以下在网上找到的以下内容，但每次重新加载的时间增加了200，当它达到6000时，重置为0

var perfData = window.performance.timing,
    EstimatedTime = -(perfData.loadEventEnd - perfData.navigationStart),
    time = parseInt((EstimatedTime/1000)%60)*100;

if (time >= 700) {
    $(window).load(function() {
        // Do something
    });
} else {
    // Do something else
}

如果估计的页面加载时间是700毫秒或更长时间，我希望它使用预加载器。

Answer 1

如果使用得当，performance Interface会有效。它与浏览器兼容。

现在，您描述的行为让我确信您不会使用它。

每次重新加载时«时间增量为200»只表示perfData.loadEventEnd等于零。那么你的计算就没有任何意义。你只有perfData.navigationStart，这是Unix整数的时间。

现在，我会完全删除time的数学运算。 EstimatedTime已经是毫秒。

然后，一旦页面完全加载，脚本应该读取timing属性。否则，perfData.loadEventEnd肯定会为零。

因此，在load事件处理程序中，使用setTimeout()确保脚本在load事件结束后执行。

var loadTime = function(){
  setTimeout(function(){
    var perfData = window.performance.timing;
    var EstimatedTime = (perfData.loadEventEnd - perfData.navigationStart);

    if(EstimatedTime>700){
      // Something for load time more than 700 ms
    }else{
      // Something for faster load time
    }
  },10);  // Executes 10 ms after load has ended
};

在标记中：

<body onload="loadTime();">

尝试在CodePen中使用它。

您的问题转载于其他CodePen。

Answer 2

页面加载的结束是什么？ window.onload？

var first= new Date();

$(window).load(function() {
   $('body').html(new Date() - first);
});

计算估计的页面加载时间

2 个答案: