如何确定不同浏览器中的 JavaScript 堆栈大小限制并对其进行故障排除？-js教程-PHP中文网

如何确定不同浏览器中的 JavaScript 堆栈大小限制并对其进行故障排除？

Linda Hamilton

发布： 2024-10-27 08:37:02

原创

342 人浏览过

How do you determine and troubleshoot JavaScript stack size limitations in different browsers?

调试 JavaScript 堆栈大小限制

背景

客户端 JavaScript 堆栈溢出，特别是在 Internet Explorer (IE) 中，可能是由于与其他浏览器相比，堆栈大小有限。使用进行大量函数调用的第三方库时经常会遇到此问题。

测试堆栈大小限制

为了确定不同浏览器的堆栈大小限制，开发了以下 HTML 测试：

<code class="html"><!DOCTYPE html>
<html>
<head>
  <title>Stack Size Limit Test</title>
</head>
<body>
  <script type="text/javascript">
    function doSomething() {
      var i = 3200;
      doSomethingElse(i);
    }

    function doSomethingElse(i) {
      if (i == 0) return -1;
      doSomethingElse(i-1);
    }

    doSomething();
  </script>
</body>
</html></code>

登录后复制

测试显示 IE8 在大约 3200 个函数调用处引发了堆栈溢出，而 Firefox 和 Chrome 支持明显更深的递归。

识别罪魁祸首

识别导致 IE 中堆栈溢出的特定 JavaScript 函数，以下操作很有用：

将堆栈溢出异常与在运行时引发该异常的函数联系起来。
获取堆栈跟踪错误发生时堆栈中的函数链。

JavaScript 堆栈跟踪

JavaScript 本身不提供堆栈跟踪功能。但是，浏览器开发人员工具（例如 Chrome DevTools、Firefox 开发人员工具）提供了在发生错误时显示调用堆栈的方法。

更简单的堆栈大小限制测试

使用的简化测试递归 inc() 函数也可用于确定给定浏览器中的最大堆栈大小：

<code class="js">var i = 0;
function inc() {
  i++;
  inc();
}

try {
  inc();
}
catch(e) {
  // The StackOverflow sandbox adds one frame that is not being counted by this code
  // Incrementing once manually
  i++;
  console.log('Maximum stack size is', i, 'in your current browser');
}</code>

登录后复制

此测试将在堆栈溢出发生后将最大堆栈大小打印到控制台。

以上是如何确定不同浏览器中的 JavaScript 堆栈大小限制并对其进行故障排除？的详细内容。更多信息请关注PHP中文网其他相关文章！