使用JavaScript測量頁面加載時間

我在JavaScript中創建了一個腳本，該腳本在自動瀏覽器測試期間注入到我們的Ext JS應用程序中。該腳本測量在我們的網格中加載數據所花費的時間。使用JavaScript測量頁面加載時間

具體來說，腳本輪詢每個網格，查看是否有第一行或「無數據」消息，並且一旦所有網格滿足此條件，腳本將記錄Date.now（）和performance .timing.fetchStart，並將其視爲頁面加載的時間。

這個腳本或多或少像預期的那樣工作，但是當與人類測量的計時（Google stopwatch ftw）相比時，這個測試報告的時間比用秒錶測量的時間長大約300毫秒。

我的問題是：

是否有這樣的邏輯，這將導致不正確的結果一個洞？
有沒有其他的選擇和準確的方法來實現這個測量？

的腳本如下：

function loadPoll() { 
    var i, duration, 
     dataRow = '.firstRow', noDataRow = '.noData', 
     grids = ['.grid1', '.grid2', '.grid3','.grid4', 'grid5', 'grid6', 'grid7']; 

    for (i = 0; i < grids.length; ++i) { 
      var data = grids[i] + ' ' + dataRow, 
      noData = grids[i] + ' ' + noDataRow; 

     if (!(document.querySelector(data) || document.querySelector(noData))) { 
      window.setTimeout(loadPoll, 100); 
      return; 
     } 
    } 

duration = Date.now() - performance.timing.fetchStart; 
    window.loadTime = duration; 
} 

loadPoll();

一些注意事項：

雖然我知道，人的反應時間可能會很慢，我肯定了300毫秒不一致不是由人類使用Google秒錶的因素引入的。
看着它可能會出現多個的投票站元素可能導致300毫秒不一致，但是當我改變從7被監視到1個元素的數量，有似乎仍然是一個代碼在自動測試報告的時間內有300毫秒的剩餘時間。
我們的自動化測試是在由 Selenium and Protractor控制的框架中執行的。

如果您能提供任何見解，請事先致謝！

來源

2017-06-22 Lucas Holmes

此問題標記爲[tag：node.js]，但問題包含使用'window'，'document.querySelector'的代碼。我正在移除標籤。 –

如果使用performance.now()，則時間應精確到5微秒。根據MDN：

的performance.now（）方法返回一個DOMHighResTimeStamp，測量以毫秒爲單位，精確到毫秒（5 微秒）的千分之五。

返回值代表自時間起點（PerformanceTiming.navigationStart屬性）以來所經過的時間。

來源

2017-06-22 16:19:57 chrisuae

謝謝，當直接比較這個Date.now（） - performance.timing.fetchStart;這似乎是更正確的20毫秒左右，這是一個正確的方向邁出的一步！ –

如果我是你，我會修改我的方法來捕捉實際的時間測量。您可以評估一段時間內您可以執行多少次呼叫，而不是評估每次loadPoll（）呼叫的時間。換句話說，您可以計算更長時間的函數迭代次數，例如1000毫秒。這是如何做到的：

var timeout = 1000; 
var startTime = new Date().getTime(); 
var elapsedTime = 0; 

for (var iterations = 0; elapsedTime < timeout; iterations++) { 
    loadPoll(); 
    elapsedTime = new Date().getTime() - startTime; 
} 

// output the number of achieved iterations 
console.log(iterations);

這種方法會給你更一致和準確的時間估計。更快的系統將簡單地實現更多的迭代。請記住，setInterval（）/ setTimeout（）並非完全精確，對於實際上很小的間隔計時器，由於垃圾收集，事件請求以及許多可以在代碼運行時並行運行的其他功能，因此這些函數可能會導致無效結果執行。

來源

2017-06-28 13:35:44 neatsu

使用JavaScript測量頁面加載時間

回答

相關問題