导致延迟的JS异步助手函数运行速度比它应该运行的要慢

Question

我正在用javascript编写一个排序算法可视化程序。到目前为止，代码还在运行，但是存在性能问题。

我正在努力使交换函数运行需要1毫秒(speed.value(。然而，除了前4次掉期外，每个掉期调用平均需要4毫秒才能解决。代码看起来像这样：

async function bubbleSort(arr, start, end) {
for (i = start; i < end; i++) {
for (j = start; j < end - i - 1; j++) {
if (arr[j].val > arr[j + 1].val) {
await swap(arr, j, j + 1);
}
}
j = 0;
}
}
async function swap(arr, a, b) {
var t3 = performance.now();
await delay(speed.value);
Bars_c.push({ a, b });
var temp = arr[a].val;
arr[a].val = arr[b].val;
arr[b].val = temp;
swapOnGraph(arr, a, b);
var t4 = performance.now();
console.log(t4 - t3);
}

function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}

如果没有"等待延迟(speed.value("，每次交换只需不到一毫秒的时间即可完成。测试该函数表明，它在swap-so-delay((重写之外按预期工作似乎毫无意义。如何更改代码，使每次交换运行需要1毫秒。

Answer 1

SetTimeout方法确实是瓶颈。可以通过运行以下代码来证明：

var results = 0,
iterations = 1000,
i = 0;
function go() {
var fn = function () {
results += new Date().getTime() - d;
i += 1;
if (i < iterations) {
go();
} else {
finish();
}
},
d = new Date().getTime();
setTimeout(fn, 0);
}

平均时间将取决于浏览器，正如Pointy所说，它可以达到16毫秒。对于这个问题，我在堆栈交换上找到了解决方案。由于这是一个可视化项目，而不是计时器建议的解决方案非常有效。