Repolode
提交项目
regl-project

regl-project/regl

一个函数式 WebGL 封装库，通过消除共享状态，把绘制调用描述为命令并编译成优化后的 JavaScript。

在 GitHub 查看官网
Star
5,594
Fork
328
未关闭 Issue
127
最近提交
22天前

这是什么？

regl 是一个 JavaScript 库，用两个抽象来封装 WebGL：资源（resource）表示缓冲区、纹理、帧缓冲等 GPU 对象的句柄；命令（command）则完整描述一次绘制调用所需的 WebGL 状态。定义命令时可以混合使用静态与动态数据，regl 会据此生成优化后的 JavaScript 代码，从而减少原生 WebGL 中每次调用的额外开销。

这个库刻意保持精简，不提供场景图、游戏引擎或向量数学工具。WebGL 的全部功能（包括多重渲染目标、实例化绘制等扩展）都可以直接使用。项目没有依赖，除 npm 包外还提供可直接通过 script 标签引入的独立版本，并在开发模式下进行参数校验。

核心功能

  • 01用资源和命令两种抽象封装 WebGL，减少共享状态。
  • 02通过部分求值把命令定义编译为优化的 JavaScript 代码。
  • 03自动将嵌套数组展开为类型化数组用于缓冲区。
  • 04提供 regl.frame 封装 requestAnimationFrame，并处理视口变化。
  • 05保留 WebGL 的全部功能，包括实例化等扩展。
  • 06没有运行时依赖，并提供独立脚本版本。

适用场景

  • 在浏览器中构建自定义的 GPU 加速数据可视化。
  • 编写需要直接控制 WebGL 的着色器图形或模拟程序。
  • 开发需要长期维护、依赖稳定底层渲染接口的 Web 应用。

快速上手

  1. 1

    从 npm 将 regl 安装到你的项目中

    npm i -S regl
  2. 2

    引入 regl 并创建实例，然后使用 regl.frame 绘制

使用前须知

  • 使用 browserify 打包时，除非加上 --debug 标志，否则开发模式的错误检查会被移除。

收录于专题

GPU 加速的 AI 训练与推理工具

标签

#webgl#graphics#javascript#rendering#shaders#gpu#regl

常见问题

regl 是什么？
一个函数式 WebGL 封装库，通过消除共享状态，把绘制调用描述为命令并编译成优化后的 JavaScript。 regl 是一个 JavaScript 库，用两个抽象来封装 WebGL：资源（resource）表示缓冲区、纹理、帧缓冲等 GPU 对象的句柄；命令（command）则完整描述一次绘制调用所需的 WebGL 状态。定义命令时可以混合使用静态与动态数据，regl 会据此生成优化后的 JavaScript 代码，从而减少原生 WebGL 中每次调用的额外开销。
regl 可以免费使用吗？用的什么许可证？
regl 以 MIT 许可证开源。用于商业产品前，请先确认许可证条款。
regl 还在维护吗？
活跃维护中。regl 最近一次提交是在 2026年10月17日。
regl 适合用来做什么？
在浏览器中构建自定义的 GPU 加速数据可视化。 编写需要直接控制 WebGL 的着色器图形或模拟程序。 开发需要长期维护、依赖稳定底层渲染接口的 Web 应用。
regl 怎么安装和运行？
从 npm 将 regl 安装到你的项目中: npm i -S regl 引入 regl 并创建实例，然后使用 regl.frame 绘制
在哪里获取 regl？
源代码和安装说明在 GitHub 上：https://github.com/regl-project/regl

概要由 AI 根据项目 README 生成；GitHub 数据每日更新。

相关项目