如果我们需要统计网页的性能数据的话,常常会受到不同的设备机器、网络环境等各种情况的影响,那么在复杂应用下,要怎么评估一些性能问题是网页内容导致的,还是用户机器性能导致的呢?
评估机器性能
对于一些复杂应用,比如代码编辑器、文本编辑器等,我们通过一些埋点拿到了大盘性能数据。如果我们需要定位一些有问题的页面内容(假设某些格式内容可能会存在性能问题),则还需要排除是机器的问题,才能拿到可多种角度参考的性能数据。
一般来说,我们在做数据上报的时候,会把一些常用数据进行上报,比如浏览器环境(navigator.userAgent
信息),我们可以根据userAgent
信息,简单区分用户的平台和终端信息。
除此之外,我们还可以使用简单的方法,来判断用户机器上的代码执行情况,比如写一段循环计算耗时:
代码语言:ts复制const start = Date.now();
for (let i = 0; i < 100000; i ) {
// 超过 100ms 就很卡了,退出循环
if (Date.now() - start > 100) break;
};
const timing = Date.now() - start;
页面启动时,可以在数据上报前运行这段测试性能数据代码,可见该耗时分布会出现在 0 到 100ms 内。
如果我们希望给机器进行评分,耗时越少的分数越高。假设评分分为 0 到 100 分,我们可以这么算:
代码语言:ts复制const score = 100 - parseInt(timing / 10);
这样我们可以算出 0 到 100 分的机器性能评估。
结束语
好久没有写这么短的内容了,不过这个评估机器性能的方法还挺有意思的,所以分享给大家仅供参考,好耶。
查看Github有更多内容噢: https://github.com/godbasin