【问题标题】：Is there a way to check how long a website takes to load with javascript [closed]有没有办法检查网站加载 javascript 需要多长时间 [关闭]
【发布时间】：2017-06-06 12:51:20
【问题描述】：
对于我的 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>
【问题讨论】：
标签：
javascript
html
css
time
load
【解决方案1】：
获取其他网站的 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>
【解决方案2】：
如果您使用的是谷歌浏览器，请点击F12，然后会弹出一个窗口。在那点击network 和refresh 你的页面。您将获得页面上每个组件的加载时间，包括 javascript。
【解决方案3】：
window.onload = function () {
var loadTime = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart;
console.log('Page load time is '+ loadTime);
}