如何衡量一个网页何时完成 2 个功能

How to to measure when 2 functions are done one web page?

本文关键字：何时完 功能 网页 何衡量 一个      更新时间：2023-09-26

所以我正在写一个页面，它将测量绘制相同事物的加载时间，但一个在 SVG 中，一个在画布中。

它在随机位置绘制正方形，并在绘制两者后加载页面 - svg 需要更多时间。但这两个时间是相同的，它看起来像是画布绘图的时间。我用来查看加载时间的方法很简单，只是从函数开始和结束的日期。这样我就知道需要多少时间。但是当我在另一幅画上尝试相同的技巧时，它给了我相同的时间 - 第一个（画布）

我做错了什么？？或者也许我不能在一页上做到这一点？？

我的代码看起来像这样：

function draw(){
before = (new Date()).getTime();
//Draw Canvas
var ctx = document.getElementById('canvas').getContext('2d');
for(var i=0;i<10000;i++){
    //code for drawing Canvas- works and is not important in this question
}
//load time  Canvas                 
var after = (new Date()).getTime(); 
var sec = (after-before)/1000; 
var renTime = document.getElementById("loadingtime"); 
renTime.innerHTML = "Figury Canvas rysowały się: " + sec + " sekund."; 
 // draw svg 
 beforeSVG = (new Date()).getTime();
for (var i = 0; i < 100000; i++) {
    //code for drawing SVG - works and is not important in this question
}
//load time SVG                 
 var afterSVG = (new Date()).getTime(); 
 var secSVG = (after-before)/1000; 
 var renTimeSVG = document.getElementById("loadingtimeSVG"); 
 renTimeSVG.innerHTML = "Figury rysowały się: " + secSVG + " sekund."; 
}

您仍在使用 svg 基准测试的画布基准测试时间：

var secSVG = (after-before)/1000;

他们不应该是：

var secSVG = (afterSVG-beforeSVG)/1000;
相关文章：