违规长时间运行的 JavaScript 任务花费了 xx 毫秒

Update:Chrome 58+默认情况下隐藏了这些和其他调试消息.要显示它们，请单击"信息"旁边的箭头，然后 Select "详细".

Chrome 57默认启用"隐藏违规".要重新启用它们，您需要启用过滤器并取消选中"隐藏冲突"框.

当其他人参与到这个项目中时，它突然出现了

我认为你更有可能升级到Chrome 56.这个警告是一个很棒的新功能，在我看来，只有当你绝望的时候，请关闭它，你的判断员会从你身上拿走分数.潜在的问题存在于其他浏览器中，但浏览器只是不告诉你有问题.Chromium的门票是here英镑，但没有什么有趣的讨论.

这些消息是警告，而不是错误，因为它实际上不会导致重大问题.它可能会导致框架掉落，或者导致不太流畅的体验.

但是，它们值得研究和修复，以提高应用程序的质量.做到这一点的方法是关注消息出现的情况，并进行性能测试以缩小问题发生的范围.开始性能测试的最简单方法是插入以下代码:

function someMethodIThinkMightBeSlow() {
    const startTime = perf或mance.now();

    // Do the n或mal stuff f或 this function

    const duration = perf或mance.now() - startTime;
    console.log(`someMethodIThinkMightBeSlow took ${duration}ms`);
}

如果你想更高级，你也可以使用Chrome's profiler，或者使用像this one这样的基准库.

一旦你发现了一些需要很长时间的代码(Chrome的阈值是50ms)，你有几个 Select :

1. 删掉一些[全部]可能不必要任务
2. 找出如何更快地完成同样的任务
3. 将代码划分为多个异步步骤

(1) (2)可能很难或不可能，但有时确实很容易，应该是你的第一次try .如果需要，应该总是可以做到(3).要做到这一点，您将使用以下方法:

setTimeout(functionToRunVerySoonButNotNow);

或

// This one is not available natively in IE, but there are polyfills available.
Promise.resolve().then(functionToRunVerySoonButNotNow);

You can read m或e about the asynchronous nature of JavaScript here.