console.log冻结javascript控制台

Question

我正在使用Chrome浏览器在本地运行html5画布网页。出于调试目的，我使用console.log试图跟踪动画中的对象像素位置，该位置发生在每秒60帧。但问题是，当我运行网页时，它工作正常，直到我打开javascript控制台，看到我的位置被打印得如此之快，开发控制台只是冻结，页面仍然运行，但我无法做任何调试，如开关在控制台等的不同选项卡之间，我必须关闭页面并重新启动它，问题很快就会再次发生。

我还使用内置工具来执行javascript CPU配置文件收集，以查看它在日志记录上花费了多少资源，结果只有0.01％的运行时间，这显然不应该是问题，但我的猜测是即使它只花了很短的时间来实现这一点，实际上忙于更新UI上的数字的控制台就是冻结页面的原因。 （我应该提一下，我仍然能够与页面进行交互，但即使只是关闭它，我也无法对控制台做任何事情）

Chrome浏览器上这是正常的吗？任何修复或建议？感谢

Answer 1

是的，我会避免垃圾邮件控制台。根据我的经验，您可以记录大量数据，例如包含数万个项目的数组，但是您不能经常调用日志函数 或者开发工具会冻结它们重绘。

因此，考虑到上述情况，我建议将几个日志调用分组在一个对象或数组中。例如，如果你有一个循环，它将运行很多次并且你有5-6个日志调用，通过将数据添加到数组或具有良好名称键的对象将这些日志调用组合在一起，并将该对象记录在循环的结束。

如果你需要每100毫秒记录一次以上，持续时间超过几秒钟，我建议对日志调用进行分组。

Answer 2

我建议在调试时，运行其他不会使控制台垃圾邮件的内容，每秒60项。当您尝试运行此代码时会发生同样的问题： for (var i = 0; i < 99999;/*This will spam the console*/ i++) { console.log(i); } 每秒喷涂控制台60次具有相同的效果，冻结屏幕。尝试让第二个变量每秒在控制台中打印一次，甚至两次，这样你就可以缩小它并修复你的错误。如果您不想让控制台崩溃，这可能是最安全的方式。

我希望这有帮助！ ：）