mcpField
T
threejs-bloom

threejs-bloom

github.com/linegel开发11138 次安装5 周前更新
代码仓库

关于 threejs-bloom

用于在 HDR 成像管线中设计 Bloom 的 Three.js 技能,帮助图形开发者选择贡献信号、配置混合与输出,并衡量成本和画质。

主要功能

  1. 01全场景或选择性 HDR 输入
  2. 02阈值与柔和膝点配置
  3. 03透明 Alpha 与光晕处理
  4. 04Bloom 图顺序与输出归属
  5. 05性能测量与资源释放

适用场景

  1. 01为 HDR 场景添加眩光
  2. 02选择性设置发光贡献
  3. 03保持透明输出的 Alpha 行为
  4. 04衡量不同输出尺寸下的 Bloom 成本

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/linegel/threejs-complete-set-of-skill --skill threejs-bloom

安装后在 Claude Code 中输入/threejs-bloom确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

LICENSE
agents/
openai.yaml
references/
hdr-bloom-system.md

详细介绍

Bloom

将光晕视为成像点扩散函数的宽广尾部。最接近的内置光学输入是所有场景线性 HDR 辐射。选择性贡献属于艺术指导分支,而非自动提升质量的选项。

1. 验证源场景

在禁用光晕的情况下,采集场景线性 HDR、色调映射前的伪彩色亮度图,以及最终图像。当高光被截断,或没有光晕时轮廓、材质或光照特征消失,就修复源场景。

当关闭光晕后的场景仍清晰可辨,且输入是基于明确工作空间、未经截断的场景线性 HDR 时,此步骤即告完成。

2. 选择信号

契约信号准入测试
发射、直接响应、反射、透射、天空和太阳产生的光学眩光完整场景 HDR亮度阈值和膝点满足贡献误差限制
指定表面的发光效果与同等亮度的辐射不同选择性发光贡献完整场景阈值无法满足这些限制,且 MRT 增量符合预算
光学高光加刻意增强场景 HDR 加选择性增强两个分量缺一不可,且共享附件仅计费一次
源场景不加眩光就无法通过,或所有光晕层级都未达到门槛延后处理光晕修复源场景或调整预算/视口

在比较不同分支之前,先稳定曝光。检查假阳性和假阴性的光晕能量,包括明亮的镜面和透射表面。

当选定一个信号分支、接受其遗漏内容,并且其贡献误差和目标设备成本符合既定限制时,此步骤即告完成。

3. 构建一个场景通道

对完整场景光晕和选择性光晕使用一次 HDR 场景遍历。完整场景光晕读取场景输出。选择性光晕在同一通道中添加一个 emissive MRT 输出,并为其设置 BlendMode(MaterialBlending)。提供显式贡献 RGBA,使用材质的 alpha 和匹配的 RGB 约定;仅靠混合因子无法修复裸的 emissive vec3 或重复预乘问题。参考内容包含逐材质表达式和修正后的发光体。

在 r185 中,材质级 mrtNode 合并可能会丢失实际生效的混合模式映射。规范的选择性路径应保留在常规 emissiveNode 上;只有在可见发光和光晕贡献必须不同时,才使用单独的、经过测量的贡献通道,或经源码验证的自定义合并方式。

添加光晕 RGB 前,先选择最终输出的 alpha 分支:

  • 不透明或已合成的输出:使用 vec4(scene.rgb + bloom.rgb, 1);
  • 透明且裁剪覆盖范围的输出:使用 vec4(scene.rgb + bloom.rgb, scene.a),并明确接受覆盖源内容范围之外的眩光会被丢弃;
  • 必须保留源内容范围之外光晕的透明输出:在 renderOutput() 前与已知背景合成,或单独输出眩光 RGB,并明确覆盖/合成约定。

保持源 alpha 不变,不能声称保留了透明光晕。根据所选的预乘/直通 alpha 策略,验证透明贡献在两种插入顺序下的重叠效果。

当场景遍历次数已明确、每项贡献都使用预期的深度/排序/混合/alpha 状态、重叠贡献能够正确累积,且最终输出的 alpha 分支明确说明源内容范围之外的光晕是被丢弃、合成还是单独表示时,此步骤即告完成。

实现完整场景、选择性或混合图,或透明选择性贡献时,请阅读 r185 图与透明混合。

4. 设置阈值和占用范围

指定阈值域:

  • 场景参考:固定在 bloom 输入的辐射度基准中;
  • 曝光线性:根据当前适配后的曝光进行转换;
  • 显示参考:仅在声明的色调映射/输出路径具有稳定的逆变换时使用。

对阈值和软膝值进行同步转换:对于曝光线性规则,将两者都除以正曝光值;对于经过验证的非线性标量规则,则对两个端点分别求逆并相减。若显示亮度不存在明确定义的逆变换,则拒绝使用。要求使用正的默认软膝值,或实现经过单独验证的硬阈值分支。将 radius 视为跨 mip 的扩散范围,而非物理半径。验证视口和 DPR 的最小值与最大值。默认 r185 的五级链要求:

floor(bloomScale * min(drawingBufferWidth, drawingBufferHeight)) >= 16

当阈值单位和更新责任方都已明确、光晕通过端点视图检查,并且最深 mip 在所有发售尺寸下都保持有效时,此步骤即告完成。

调整扩散范围、缩放或非标准光学占用范围时,请阅读 BloomNode PSF 和工作量。

5. 接入最终图像图

使用以下默认顺序:

stable scene-linear HDR
  -> temporal resolve, when present
  -> excluded transparent/refractive layers
  -> pre-bloom meter tap
  -> bloom extraction, blur, and RGB add
  -> adapted exposure
  -> tone map, grade, and one output conversion

绕过时序解析的选择性输入,仍需要针对亚像素或不连续发光做出稳定性决策。除非视觉规范包含 UI 和诊断信息,否则应将它们排除在 HDR bloom 之外。更改活动输出图后,设置 RenderPipeline.needsUpdate = true。

当 bloom 只有一个责任方、每个纳入处理的计量、曝光、色调映射、Alpha 操作和输出转换都只有一个责任方、所选输出 Alpha 分支在呈现过程中得到保留,并且确实可以使用关闭 bloom 的图时,此步骤即告完成。

需要将阈值与曝光关联,或选择最终输出责任方时,请阅读 曝光、输出和生命周期。

对于与曝光关联的阈值、色调映射、调色和输出转换,请使用 $threejs-exposure-color-grading。如果场景通道、MRT 信号、透明对象排序或最终图与其他效果共用,请使用 $threejs-image-pipeline。

6. 测量、降级并释放资源

测量预热后的成对图:仅场景、全场景 bloom、带贡献 MRT 的场景,以及适用时的选择性/混合 bloom。报告物理像素、缩放比例、附件格式、目标库存、透明内容屏幕覆盖范围、持续运行时间和边际耗时。若未达到像素受限场景的要求,先降低 bloom 缩放比例,然后重新测量;全场景输入可以移除开销较大的全分辨率贡献附件。若最小 mip、内存、温度或边际耗时门槛仍未通过,则禁用 bloom。

为禁用路径替换输出节点,将管线标记为脏状态,并在最后一次 GPU 使用后释放 BloomNode 和任何专用贡献资源。Uniform 更新不会重建图;结构性重建应使用全新节点,或采用幂等且固定版本的修正,因为默认设置会追加材质。渲染器/设备丢失或格式代际发生变化后,重新创建验证数据。

当所有发售档位都通过固定截图和目标设备持续运行预算检查、关闭 bloom 后的计时不再包含 bloom 开销,并且重复启用/禁用、调整尺寸和释放资源的循环能够稳定资源时,此步骤即告完成。

计算精确的内部存储/工作量,或诊断未通过的门槛时,请阅读 预算与验收。

评论

支持 Markdown