14

我今天早些时候(在 TechCrunch.com 上)遇到了这个概念证明,并对他们如何设法完成最终结果感到震惊和好奇。他们表示他们不使用 webGL 或任何插件,但他们能够直接与 GPU 交互并使用 Javascript 以高达 60 fps 的速度渲染 3D 视觉效果。有什么想法可以做到这一点,或者如何在不使用插件的情况下从 Javascript 访问 GPU?

网站地址是:famo.us

ps:尝试使用箭头键将方向转移到远处!

4

4 回答 4

17

他们使用标准的HTML5Javascript API 来实现这一点。

requestAnimationFrame我在他们的代码中看到了几个引用。这种方法允许使用兼容浏览器的人显示更流畅和优化的动画,其帧速率远高于setInterval基于动画所允许的帧速率。这当然是通过使用 GPU 和可用的硬件背景来实现的。

无法使用任何 Javascript 例程直接访问 GPU 或所有其他硬件组件。相反,浏览器会根据调用的 JS 指令和执行上下文,尽可能使用 GPU来优化一些特定的处理、演算和渲染。

编辑

为了将来的参考,我最近发现(在最初的答案之后 7 年)最近在 2020 年创建了一项新计划 -用于 Web 社区组的 W3C GPU来做到这一点。它描述如下。

Web 社区组中 GPU 的使命是提供 Web 平台与本地系统平台中存在的现代 3D 图形和计算能力之间的接口。目标是设计一个新的 Web API,以高性能、强大和安全的方式公开这些现代技术。它应该与现有的平台 API 一起使用,例如 Microsoft 的 Direct3D 12、Apple 的 Metal 和 Khronos Group 的 Vulkan。该 API 还将向 Web 公开当今 GPU 中可用的通用计算工具,并研究着色器语言以生成跨平台解决方案。

从长远来看,这一举措可能允许开发人员从所有 Web 浏览器直接与 GPU 进行交互。您可以在此处跟踪Github 上的WebGPU API 规范的实施状态。

于 2013-03-04T23:46:24.117 回答
7

关于famo.us:他们确实分析了Webkit渲染管道的瓶颈,然后在构建页面时找到了绕过它们的方法。基本上:DOM树的构建,Render树的构建,Render Tree的Layout都被绕过了。看看这篇文章以获得完整的解释。

在此处输入图像描述

于 2013-12-03T11:04:04.037 回答
1

他们正在使用 CSS 3D 变换。Web 浏览器越来越多地使用硬件加速来做这些 CSS3 的事情。

于 2013-03-05T00:00:20.873 回答
1

我认为 webGL glsl.js 库可能对此有好处,尽管我没有看到基准... https://github.com/gre/glsl.js/

这种方法似乎也是可行的;

基本上以我们喜欢的方式使用gpu,使用硬件优化功能(稍微看看“blas”),你不想写这些!奇怪的是,人们似乎仍在使用旧的 fortran blas.... 有一些东西通过 llvm 编译,然后使用 emscripten 将其转换为 javascript。 将 Emscripten 与 Fortran 一起使用:LAPACK 绑定

emscripten 方式似乎是最通用的,我正要检查它,但它看起来像一座山,而且这个话题似乎有点像在呼吁武装,emscripten 只有在你破解它时才适用于 fortran(请参阅来自第二个链接)。我认为我们正在寻找的是对 javascript 的 blas 支持,这无论如何都不是一个已解决的问题,对于我们中的一些人来说,这非常令人沮丧!希望有人有我们找不到的这些 blas 库的链接……如果我对这个问题不太了解,请告诉我,js 对我来说是新的。

此外,建议 html5 已充分“优化”以使用硬件,我们怎么能相信这一点!?我们需要 gpu 优化的 blas(基本线性代数子程序),例如点积。

我想也许这些旧的fortran blas arnt实际上对于现代gpu来说是正确的?node-cuda 似乎很可能是我发现的最好的东西......

于 2015-01-28T02:35:15.107 回答