在 Javascript 中进行长时间运行的计算时如何避免冻结浏览器

2023-11-24

我有一个网页,其中函数中的 JavaScript 计算需要花费大量时间才能完成,并使页面冻结。当计算在后台进行时,我应该使用什么技术来确保 javascript 不会冻结浏览器?


如果您只需要进行计算并且不需要在长时间运行的计算过程中访问 DOM,那么您有两种选择:

  1. 您可以将计算分解为多个部分,然后一次执行一个部分setTimeout()。在各个setTimeout()调用后,浏览器将可以自由地服务其他事件,并使页面保持活动状态并响应。当你完成最后一部分计算后,你就可以执行结果了。
  2. 您可以在现代浏览器中使用网络工作者在后台运行计算。当计算在 webworker 中完成时,它会向主线程发送一条消息,然后您可以使用结果更新 DOM。

这是一个相关的答案,也显示了一个示例:在不阻塞 UI 的情况下迭代数组的最佳方法

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Javascript 中进行长时间运行的计算时如何避免冻结浏览器 的相关文章

  • 如何从ArrayBuffer中获取二进制字符串?

    JavaScript中如何从ArrayBuffer中获取二进制字符串 我不想对字节进行编码 只需将二进制表示形式获取为字符串 提前致谢 以下代码将一致地转换ArrayBuffer to a String并再次返回 而不会丢失或添加任何额外的
  • 邮件附件媒体类型错误 Gmail API

    我正在尝试通过 Javascript 客户端中的 Gmail API 发送带有附加 jpeg 文件的消息 到目前为止我写的代码如下 ajax type POST url https www googleapis com upload gma
  • 最小的 ExtJS 包是什么?

    有谁知道 Ext JS 2 2 所需的最少文件吗 我知道 ExtJS 网站有一个功能 build http extjs com products extjs build ExtJS ext js 的小版本 作为 ext all js 的替代
  • 当语料库有100亿个独特的DNA序列时,如何使用BK树实现快速模糊搜索引擎?

    我正在尝试使用BK tree https news ycombinator com item id 14022424python 中的数据结构 用于存储约 100 亿个条目的语料库 1e10 以实现快速模糊搜索引擎 一旦我添加超过 1000
  • 为什么“dtoa.c”包含这么多代码?

    我将是第一个承认我对低级编程的整体知识有点稀疏的人 我理解许多核心概念 但我不经常使用它们 话虽这么说 我对需要多少代码感到非常惊讶dtoa c http www netlib org fp dtoa c 在过去的几个月里 我一直致力于用
  • 如何在 JavaScript 中构建一个计算数组中出现次数的对象?

    我想计算数组中某个数字出现的频率 例如 在Python中我可以使用Collections Counter创建一个字典 记录某个项目在列表中出现的频率 据我所知 JavaScript 是这样的 var array 1 4 4 5 5 7 va
  • JointJS - 处理链接删除点击

    创建链接后 将鼠标悬停在其上会显示红色 X 以将其删除 单击此按钮将触发一系列事件 通过订阅 全部 活动收集 单元格 向下指针 链接 向下指针 cell pointermove x5 似乎可疑 单元格 指针向上 在浏览了文档并花费了太长时间
  • Angular-Datatables + Angular-xeditable:取消可编辑行

    当组合 Angular DataTables 和 Angular XEditable 时 添加新行时会取消可编辑行 这是jsfiddle https jsfiddle net faj61h5d 10 示例操作如下 1 这是初始状态 2 将第
  • Web浏览器控件:如何捕获文档事件?

    我正在使用 WPF 的 WebBrowser 控件加载一个简单的网页 在这个页面上我有一个锚点或一个按钮 我想在我的应用程序后面的代码中 即在 C 中 捕获该按钮的单击事件 WebBrowser 控件是否有办法捕获加载页面元素上的单击事件
  • 如何调试性能问题/优化您的流星应用程序

    我刚刚将 Meteor 应用程序部署到 Digital Ocean 上的生产服务器上 我注意到 对于大约 7500 个文档 完全获取对象 有选择地仅获取 3 个字段 并填充自动完成数据大约需要 3 5 秒 我相信对于如此数量的数据来说 它应
  • 如何为 ng-repeat orderBy 创建回调?

    寻找一种方法让 AngularJS 的 ng repeat orderBy 过滤器在完成渲染后执行回调 Markup div table thead tr th Name th th Age th tr thead tbody tr tr
  • 获取 2 个日期之间的月份名称

    我有两个约会from and to 我想获取这两个日期之间的所有月份名称 以下是我的代码 var monthNames January February March April May June July August September
  • nvd3.js - 无法更改折线图中线条的颜色

    我正在尝试更改 nvd3 折线图不同线条的颜色here http nvd3 org livecode index html codemirrorNav但我无法理解该怎么做 我想将示例中的 2 条线的颜色更改为绿色和青色 我试过 nv add
  • 盒式捆绑包与 MVC4 捆绑包

    我目前正在开发一个原型 ASP NET MVC 3 解决方案 该解决方案将用作多个项目重写的基础 来自 Web 表单 我的目标之一是跨应用程序实现一些脚本管理 而不是我们目前没有的目标 MVC 3有一个缺陷恕我直言 如果您需要在部分视图或模
  • 使用 JavaScript 从 URL 变量读取来加载不同的 CSS 样式表

    我试图在我的 WordPress 博客上使用两个不同的样式表 以便在通过 Web 访问页面时使用一个样式表 而在通过我们的 iOS 应用程序访问博客内容时使用另一个样式表 现在 我们将 app true 附加到来自 iOS 应用程序的 UR
  • 地址更改时如何停止 Angular 重新加载

    我正在使用 Angular 的scrollTo and anchorScroll像这样 app controller TestCtrl function scope location anchorScroll scope scrollTo
  • 如何在 jQuery 中检查复选框是否被选中?

    我需要检查checked复选框的属性 并使用 jQuery 根据选中的属性执行操作 例如 如果age复选框被选中 然后我需要显示一个文本框来输入age 否则隐藏文本框 但下面的代码返回false默认情况下 if isAgeSelected
  • jQuery fadeOut 一个 div,fadeIn 另一个 div 在其位置

    我正在尝试一个简单的 jQuery 脚本来淡出一个 div 并淡入另一个 div 但由于某种原因 第一个 div 永远不会淡出 这可能是代码的一个明显问题 但我似乎无法弄清楚 div div div div
  • 我可以防止将 Leaflet 地图平移到世界边缘之外吗?

    有没有办法限制平移到世界边缘之外 在这幅画中 棕色是世界 灰色是虚空 我想让它不可能像这样平移 Leaflet 允许您控制地图抵抗被拖出边界的程度maxBoundsViscosity选项 值 0 到 1 将其设置为最大值会完全禁用拖动出界
  • 使用 stopPropagation() 处理 React 事件委托

    我有一个 React 项目 应该可以放置在任何网站上 我的想法是 我托管一个 javascript 文件 人们放置一个具有特定 ID 的 div 然后 React 在该 div 中进行渲染 到目前为止 除了点击事件之外 这是有效的 这些事件

随机推荐

  • Jquery 中的鼠标事件

    基本上 我有这个带有左右箭头按钮的图像 该图像默认是我从某些 gif 中提取的第一帧 原始 gif 包含 31 帧 我的目标是当用户单击向右箭头按钮时 我想显示下一帧等等 一切都运行良好 如下面的代码所示 但是 我需要添加一些鼠标按住事件
  • 保存网页以供离线使用并调用相同的 android

    我有一个 Android 应用程序要求 我需要打开保存的网页 如何做同样的事情 首先 我们如何保存一个网页及其对Android的依赖 然后在您的应用程序中打开它 任何输入都会有很大帮助 首先我们先保存一下网络档案 from webview
  • 仅返回 Task 而不是 Task 的方法会返回什么?

    我从什么返回D4 async static Task D4 Console Write Enter the divisor var n int Parse Console ReadLine Console WriteLine 24 n To
  • 使用flask-bcrypt生成和验证密码哈希

    所以我最近学习了如何在数据库中存储密码 即通过向明文密码添加盐 对其进行散列 然后存储散列 我正在开发一个非常小的 Flask 应用程序来尝试所有这些 但我在密码散列和检查过程的部分方面遇到了问题 似乎我最终得到了相同输入的两个不同的哈希值
  • Postgresql 中 SQL Server 的“stuff”和“for xml path('')”

    我正在将一些 SQL Server 2008R2 查询迁移到 Postgresql 9 0 但遇到了一些问题 这是 SQL Server 查询 stuff select p NAME as data from BPROVIDERS PROV
  • Android 网络库的比较:OkHTTP、Retrofit 和 Volley [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 目前不接受答案 一位正在学习 Android 的 iOS 开发人员提出的问题分为两部分 在iOS上我用过AF网络项目广泛 Android 有等效的库吗 我读过OkH
  • Firestore如何存储对文档的引用/如何检索它?

    我是 Firestore Firebase 的新手 我正在尝试创建一个新文档 其中一个字段是document reference到其他文档 我已阅读 Firebase 的所有指南和示例 但没有找到任何内容 另外 当我检索我创建的文档时 我将
  • 使用 webpack 2 和 vue-cli 加载本地字体

    我正在使用 vue cli webpack 模板 并尝试在我的项目中加载本地字体 我无法正确获取字体路径 我的道路应该是什么样子 我发现了一些关于我可能做错了什么的信息 但我无法弄清楚 https github com webpack co
  • 从 RGB 值数组中(就地)切片平面的算法

    我有一个字节 RGB 值的平面数组R1 G1 B1 R2 G2 B2 R3 G3 B3 Rn Gn Bn 所以我的数据看起来像 char imageData WIDTH HEIGHT 3 但我想将 WIDTH HEIGHT 数组传递给需要该
  • 带有类加载器的 Java 示例

    我有一个小问题 我学习java SE并找到类ClassLoader 我尝试在下面的代码中使用它 我正在尝试使用 URLClassLoader 在运行时动态加载类 URLClassLoader urlcl new URLClassLoader
  • 正则表达式选择引号之外的字符

    我想找到一个正则表达式来挑选出引号集之外的所有逗号 例如 foo gt bar foofoo gt bar bar 这将在第 1 行之后挑选出单个逗号 bar 我真的不关心单引号和双引号 有人有什么想法吗 我觉得预读应该可以做到这一点 但我
  • PHP 中 Skype 名称的正则表达式

    我想在 PHP 中使用正则表达式验证 Skype 名称 NOTE 它必须介于 6 32 个字符之间 以字母开头 并且仅包含字母和数字 不含空格或特殊字符 这个模式应该适合你 a zA Z a zA Z0 9 5 31 这将匹配一个前导字母
  • VBA 中作为类成员的类对象数组

    我正在用 VBA 编写一个 Excel 宏 向图书馆顾客发送电子邮件 提醒他们逾期的资料 数据来自电子表格 其中包含以下数据 UserID Name Email Title Author Barcode Call Number Borrow
  • 有没有办法使用 doxygen 记录 cuda 的“.cu”文件

    由于cuda的 cu 文件基本上是c 有没有办法我们可以使用doxygen为 cu 文件生成文档 我注意到 NVIDIA 使用 doxygen 来生成 cuda 的文档 但是 当我使用 doxygen 时 cu 文件将被忽略 如果其他人也遇
  • 对多个字段中的值进行计数

    我正在尝试计算一组具有多个字段的对象的不同值 e g 对象文章有很多标签对象字段 一篇文章有 标签 tag1 tag2 另一篇文章有 标签 tag2 tag3 我想找出一些可以返回以下内容的东西 标签1 1 标签2 2 标签3 1 我以为我
  • NUnit 与 Assert.AreEqual 不能很好地配合

    我对单元测试尤其是 NIt 很陌生 我只是从书中输入一些涉及 Java 和 JUnit 的示例 但我改用 C 问题是 我有一个带有重写方法的类 例如Equals and GetHashCode 但是当我尝试将此类的两个对象与Assert A
  • 为 Mac 安装 ext-zip

    我正在尝试跑步composer update我收到以下错误 Problem 1 The requested PHP extension ext zip is missing from your system Install or enabl
  • 如何阻止 R 加载包?

    我正在使用 R 中的多核包来并行化我的代码 但是 如果加载了 tcltk 包 则使用多核包分叉进程将导致 R 无限期挂起 所以我想阻止 tcltk 加载 如果任何包尝试将其作为依赖项加载 我希望立即出现错误 这可能吗 或者 我可以unloa
  • 为 jinja2 中未定义的属性引发异常

    我需要以下内容来引发异常 jinja2 Template Hello a x render a Jinja2 默默地返回一个空字符串a x 所以这呈现为 Hello 如何让 jinja2 对未定义的属性引发异常 from jinja2 im
  • 在 Javascript 中进行长时间运行的计算时如何避免冻结浏览器

    我有一个网页 其中函数中的 JavaScript 计算需要花费大量时间才能完成 并使页面冻结 当计算在后台进行时 我应该使用什么技术来确保 javascript 不会冻结浏览器 如果您只需要进行计算并且不需要在长时间运行的计算过程中访问 D