更新:Chrome 58+默认隐藏这些和其他调试消息。要显示它们,单击“信息”旁边的箭头,并选择“详细”。
Chrome 57默认开启“隐藏违规”。要打开它们,你需要启用过滤器并取消选中“隐藏违规”框。
突然,当其他人参与这个项目时,它就出现了
我觉得更可能是你更新到Chrome 56。这个警告是一个很好的新功能,在我看来,只有在你非常绝望,考官会扣你分的时候,才请关闭它。潜在的问题在其他浏览器中存在,但浏览器只是不告诉你有问题。铬票在这里,但实际上没有任何有趣的讨论。
这些消息是警告而不是错误,因为它不会真正导致重大问题。它可能会导致帧被丢弃或导致不太流畅的体验。
但是,为了提高应用程序的质量,它们是值得研究和修正的。做到这一点的方法是关注消息出现的情况,并进行性能测试以缩小问题发生的位置。开始性能测试最简单的方法是插入如下代码:
function someMethodIThinkMightBeSlow() {
const startTime = performance.now();
// Do the normal stuff for this function
const duration = performance.now() - startTime;
console.log(`someMethodIThinkMightBeSlow took ${duration}ms`);
}
如果你想要更高级,你也可以使用Chrome的分析器,或者使用像这样的基准测试库。
一旦你发现一些代码需要很长时间(50ms是Chrome的阈值),你有几个选择:
砍掉一些/全部不必要的任务
弄清楚如何更快地完成同样的任务
将代码分成多个异步步骤
(1)和(2)可能很难或不可能,但有时真的很容易,应该是你的第一次尝试。如果需要,它应该总是可以做到(3)。要做到这一点,你将使用如下内容:
setTimeout(functionToRunVerySoonButNotNow);
or
// This one is not available natively in IE, but there are polyfills available.
Promise.resolve().then(functionToRunVerySoonButNotNow);
你可以在这里阅读更多关于JavaScript异步特性的内容。