从 Web Worker 内部使用 WebGL:可能吗?如何?

2023-11-22

我打开这个矩阵乘法基准我的浏览器 (Firefox 7.0.1) 冻结,直到基准测试完成(我在旧的 Asus EeePC 1000H 中打开页面)。

我听说网络工作者的发明是为了将处理与显示网页分开。是否可以利用 Web Workers API 使 WebGL 不会停止整个 Web 浏览器?


为了清楚起见:您链接到的基准测试根本不使用 WebGL。 (我应该知道,是我写的。)对于特定的基准测试,您现在绝对可以在 Web Worker 中运行它,而且效果非常好。

(有趣的事实 - Web Workers 在构建基准测试时不支持 TypedArrays,并且由于大多数矩阵库都依赖于当时在 Worker 中运行它是不切实际的。此后这个问题已得到修复。)

不管怎样,回答你原来的问题:不,WebGL 不能在工作线程中运行。核心阻碍是为了获取 WebGL 上下文,您需要调用getContext在画布元素上。 Web Workers 明确禁止 DOM 访问(顺便说一句,这是一件好事!),因此您将永远无法从 Worker 访问 WebGL。

但这并不像您想象的那么糟糕。其一,考虑到大多数 3D 渲染实际上都发生在不同的线程中。具体来说,是在 GPU 上运行的一大堆线程。浏览器的唯一部分是告诉您的图形驱动程序“嘿!开始使用这些数据渲染一些三角形!”然后它继续前进,而不等待三角形被实际渲染。因此,虽然绘制命令必须从主进程执行,但阻塞该进程所花费的时间(通常)非常少。

当然,如果您正在编写实时游戏,那么这不会占用您大量的时间。你有动画、物理、人工智能、碰撞检测、寻路……其中涉及很多非图形任务,如果你允许的话,它们会耗尽你的 CPU。在某些情况下(动画),它通常只是大量的矩阵数学,就像您链接到的基准一样!然而,对我们来说幸运的是,这种类型的处理可以在 Worker 中完成,并且我们需要与主线程通信的只是渲染场景所需的数据。

是的,这在同步和数据传输方面带来了一些挑战,但总的来说,这比在我们尝试模拟这 500 个盒子碰撞时锁定浏览器要好得多。

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

从 Web Worker 内部使用 WebGL:可能吗?如何? 的相关文章

  • 从多个“输入:文件”中删除 FileList 项

    我有这个 DOM var id 0 input file upload 0 files id 这是第 0 个索引上的第一个文件 列出了文件属性并且一切正常 但是 我们如何从 DOM 中删除项目 object FileList 使用 Java
  • 如何制作可扩展的文本框?

    我想制作一本以给定宽度 高度开始的教科书 然后 如果用户输入的内容超过给定的空间量 文本框就会向下扩展 我该怎么做呢 我使用 CSS 吗 当用户超过允许的行数时 基本文本框仅显示滚动条 如何使文本框将行数再扩展 5 行
  • 使用 Javascript 基于 Cookie 的重定向

    我正在尝试根据 cookie 的存在创建重定向 所以当用户连接到我的网站时jonathanstevens org他们第一次被重定向到jonathanstevens org landing 代码部分 Global js function cr
  • jQuery find() 只返回第一个匹配的结果?

    我在 jQuery 中使用 find 方法 但无法获得与选择器条件匹配的所有结果 这是我的 HTML div class something div
  • 提交ajax表单并停留在同一页面不起作用

    我想将用户的评论存储在我的数据库中 当用户提交时 我不想将他们重定向到新页面 我有以下代码 但它不起作用 我的 HTML 代码
  • 父元素的 mousedown 事件中的 offsetX 和 offsetY 错误

    我在 mousedown 上获取 offsetX 时遇到问题 下面是我的代码 div Click the text The mouseDown function is triggered when the mouse button is p
  • 如何在CSS中嵌套多个计数器?

    我想用 CSS 嵌套两个不同的编号 以获得如下所示的自动编号 1 第 1 节 1 1 小节1 1 2 小节1 2 第 2 节 2 1 小节2 2 2 小节2 这是我实现这一目标的尝试
  • 如何在标签中制作文字自动换行

    我想在其中添加文字 a 标签适合固定的 div 但它会破坏 div 并且显示得很丑 CSS3 有一个属性 word wrap break word 看看MDN 自动换行文档 https developer mozilla org en CS
  • 如何使用 Angular 2 实现拖放(v2.0.0-beta.15)

    我想以角度实现一个简单的拖放列表 例如我可以更改其顺序的杂货列表 iv 在使用之前实现它https github com akserg ng2 dnd https github com akserg ng2 dnd但我的问题是我使用角度2
  • 文本区域值高度[重复]

    这个问题在这里已经有答案了 我有一个 textarea 其 css 高度设置为 85px 用户可能会在该文本区域内键入内容行 我想知道文本 值的高度 而不是文本区域本身 有没有办法检查内部文本的高度 包括换行符 我会将文本区域的内容复制到另
  • 给定 url,如何加载图像,然后将其转换为 Javascript 中的 tf.tensor 数据?

    我是前端和 javascript 新手 现在我正在编写一个基于 CNN 的 Web 应用程序 要从给定的 url 加载图像 然后将图像输入 CNN 我尝试编写以下代码 async function getImage var img new
  • 在 HTML TextArea 中设置(或读取)光标/插入符的值

    我正在尝试 但失败了 在 HTML 文本区域中实现拖放机制 使用 jQuery 或 Scriptaculous 我们都使用 拖放机制相对容易 因此我愿意接受使用这两者之一的答案 问题是 我似乎找不到读取或设置插入点的方法 我最终想要做的是确
  • Django 未在 404 页面上应用应用程序中的 CSS 文件

    姜戈3 0 8 Python 3 7 x 我有一个包含一些应用程序的 Django 项目 我正在尝试为 400 403 404 500 错误制作一些 默认 错误页面 我已经这样做了 并显示了适当的模板 但没有任何样式或 JS 在 404 错
  • javascript获取网页中选定文本的段落

    突出显示文本后 我想获取所选文本所在的段落 var select window content document getSelection 请问有什么指点吗 这实际上很难做到 因为你必须考虑六种情况 所选内容不在一个段落内 简单 整个选择都
  • 将压缩的json数据存储在本地存储中

    我想将 JSON 数据存储在本地存储中 有时存储的数据可能超过 5MB 每个域的浏览器允许的最大阈值 无论如何 我可以压缩或压缩数据并将其存储在本地存储中吗 如果对大数据进行每个 JS 函数的压缩和解压 会增加多少延迟 我正在使用这个 js
  • 如何创建环境变量来保护我的网站的 Google 地图 API 密钥(或任何其他秘密值)?

    我正在学习使用 Bootstrap 编写自己的网站 并使用 Google 地图 API 密钥和 Google Developers 的脚本轻松地将地图放置在我的页面上 理想情况下 我会有类似的东西 即我已经尝试过这个 Html PHP
  • 如何使网站适应用户的屏幕分辨率?

    我正在使用 1024x768 屏幕分辨率来设计我的网站 当您从屏幕分辨率较小 较大的计算机上的浏览器中查看网站时 网站开始变形 无论用户的屏幕分辨率是什么 如何使网站适应用户的屏幕分辨率 我相信通过 JavaScript 或 CSS 是可能
  • 禁用 iframe 中的滚动

    有没有办法在 iframe 中禁用所有滚动 我有一个 iframe 其中内容超出了 iframe 尺寸 设置scrolling no 只会删除滚动条 但不会禁用滚动 我无法控制 iframe html 的头部 所以我无法设计它的样式 有任何
  • 使用js获取选择选项的onclick事件

    我有一个非常令人沮丧的问题 我有这个代码 它过滤掉我的结果并将它们输入到选择框中 var syn
  • CSS交付优化:如何推迟CSS加载?

    我在尝试着优化 CSS 交付遵循针对开发人员的谷歌文档https developers google com speed docs insights OptimizeCSSDelivery example https developers

随机推荐