在html頁面顯示加載時間

Question

我想在我的 html 頁面的頁腳中顯示加載所需的時間（使用 javascript）。 但是我注意到頁面上顯示的加載時間與瀏覽器中顯示的頁面加載時間不匹配。

這是我的 javascript 代碼：

(() => {
     const loadStart = new Date().getTime();

     window.addEventListener('load', () => {
         const timeStamp = document.querySelector('#timestamp');
         timeStamp.innerHTML += `Page load time: ${(new Date().getTime() - loadStart) / 1000} sec`;
     });
 })();

我在頁面中連接腳本並使用 css-selector 的 id 來顯示時間。

我看到的最佳解決方案是使用 JavaScript API 但它已被棄用。 我想使用更現代的方法。

Answer 1

嘗試這個

time.loadEventStart - time.navigationStart

來自 performance.timing