有没有办法检查网站加载 javascript 需要多长时间？

Question

对于我的 Science Fair 项目，我需要能够了解网站每 10 秒加载一次需要多长时间。问题是我不确定如何加载网站并检查加载需要多长时间。到目前为止，我已经制作了一个程序，它只告诉您在文本框中键入的内容，我现在需要的只是如何检查网站的加载时间。 -先感谢您这是代码

<html>
<body id='body'>
    <p>Website Checker</p>
    <textarea id='websiteurl' rows="1" cols="50"></textarea><br>
    <button onclick="checkhowlongittakes()">Input!</button>
</body>
</html>

<style>
    #body {
        background-color: coral;
    }    
</style>

<script>
    document.getElementById('websiteurl').value = 'Input the url here'
    function checkhowlongittakes() {
        weburl = document.getElementById('websiteurl').value
    //Checkhowlongthewebsitetakestoload(weburl)
    }
</script>

Answer 1

window.onload = function () {
    var loadTime = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart; 
    console.log('Page load time is '+ loadTime);
}

Answer 2

如果您使用的是 Google Chrome，则单击 F12，然后单击 window pops-up。在该页面上单击 network 和 refresh。您将在页面上获得每个组件的加载时间，包括 javascript.

Answer 3

获取其他网站的 ping 时间：

function checkhowlongittakes() {
    weburl = document.getElementById('websiteurl').value;
    getLoadTime(weburl, function(time) {
        console.log("load time for " + weburl + " was " + time + " ms");
    });
}
function getLoadTime(url, callback) {
    var req = new XMLHttpRequest();
    var start = Date.now();
    req.onreadystatechange = function(e) {
        if (this.readyState == 4)
            callback(Date.now() - start);
    }
    req.open("GET", url);
    req.send();
}

<p>Website Checker</p>
<textarea id='websiteurl' rows="1" cols="50" placeholder="http(s)://">https://stacksnippets.net</textarea><br>
<button onclick="checkhowlongittakes()">Input!</button>

有没有办法检查网站加载 javascript 需要多长时间？

Is there a way to check how long a website takes to load with javascript

html

javascript

css

time

load