javascript - 如何调试导致网页加载时间过长的脚本？

Question

我公司的一个内部网站有一个页面需要很长时间才能加载。当我使用 IE 11 查看页面时，显示以下消息:

[domain] is not responding due to a long-running script

消息对话框有一个“停止脚本”按钮但没有“调试”按钮。

此网站使用了大量过去构建的 JavaScript 脚本，我需要对其进行调试，以确定是其中哪一个脚本导致了此问题。

我的问题是 IE 不允许我在页面加载之前启动 F12 开发人员工具，如果我在加载页面之前打开 F12 工具然后重新加载页面，调试工具窗口就会消失。

我想问的问题:

1. 如何让 F12 工具保持打开状态以分析打开 页面？
2. 或者有没有一种方法可以调试在页面加载时运行的脚本，使用 Firefox (v.45.8) 调试工具？

Answer 1

保持 F12 开发者工具打开:

• 要使 Internet Explorer 工具栏保持可见，请点击 Alt，点击查看，指向工具栏并选中菜单栏，然后单击锁定工具栏。 Info来自微软

IE 中的调试选项:

• 如果您有权访问文件，则可以将此标记粘贴到您尝试调试的页面上，它将打开 Firebug : <script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>

• 如果您无权访问文件，您仍然可以通过此 bookmarklet 使用 Firebug Lite : javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');

• 使用 IEDiagnosticsAdapter .它是一个代理，使工具能够使用 Chrome 远程调试协议(protocol)来调试和诊断 IE。

• 安装 Debug Bar ，它为内置开发人员工具提供了扩展功能集。
• 安装 IE Tester ，它模拟各种 IE 实例(版本)，并使用其内置的调试栏。通过这种方法，您还可以查明特定于版本的问题。

你也可以看看How to troubleshoot script errors in Internet Explorer微软的文章。