教程内容规范
本文件约定本系列各章的写法。README 是已完成内容的阅读入口,PLAN 是分阶段计划。布局参考 shader-threejs 的写作规范,但内容围绕混合、深度和粒子系统重新编写。
技术基线与术语
- Three.js 固定为 r174(
0.174.0),基础示例使用WebGLRenderer,从示例目录内的three.module.js导入;该模块依赖同目录的three.core.min.js。后续出现WebGPURenderer或其他版本时单独标明,不混用行为。 - 先展示 Three.js 原生实现:
Mesh、Points、PointsMaterial、BufferGeometry、BufferAttribute、ShaderMaterial。第三方库只在第 20 章引入,并锁定经实际验证的兼容版本。 - 首次出现的专业词同时给出中文与英文;明确“粒子”可以指绘制用的小图元,也可以指带状态的模拟个体。鸟群、人群需要额外的行为规则。
- 用“深度测试”表示与已有深度值比较,用“深度写入”表示更新深度缓冲;“物体遮挡”是视觉结果,“遮挡剔除”是省去被挡对象的部分渲染工作。不得把它们混称。
- 说明 WebGL 中的颜色计算与输出色彩空间。使用颜色贴图时设置合适的
texture.colorSpace;讲混合时分清纹理 Alpha、材质透明设置与混合方程。 - 涉及性能时分别讨论 JS 更新、缓冲上传、绘制调用和 overdraw。粒子数量、画布尺寸、像素比与设备条件要一起记录。
文件布局与分工
particle-system/
├─ README.md # 已完成内容的阅读目录
├─ WRITING-GUIDE.md # 本文件
├─ PLAN.md # 分阶段计划
├─ 01-*.md ... 20-*.md # 教程正文,按完成进度加入
├─ appendix-a-troubleshooting.md # 有内容时建立
├─ exercises/
│ ├─ README.md
│ └─ 01-*.md ... 20-*.md # 独立练习和各章参考答案
└─ examples/
└─ stage-00/ ... stage-09/ # 可运行示例,按编写阶段加入
正文文件以两位章节号开头。练习文件沿用相同编号;文件名不必和正文完全相同,但 README 与正文应能找到对应练习。示例目录按编写阶段组织,一个章节可有多个页面。
正文、练习、答案的边界
- 正文按“现象 → 原理 → 最小代码 → 参数变化 → 常见问题”推进。开头列前置知识、示例页面和预期画面;代码说明涉及的坐标空间、单位和运行位置。
- 正文可以让读者调节示例参数观察结果,这属于讲解实验;需要动手改代码的独立任务只写在
exercises/。 - 每道练习都写明目标、起始示例、限制条件和可观察的完成标准。题目部分不直接给完整解法;提示可折叠。
- 参考答案放在对应练习文件末尾,用明确分隔和跳转隔开。给出可运行解法及关键解释;存在合理替代做法时说明其适用条件。
- 章节末尾可以链接对应练习,但不要在正文复制题目和答案。还未编写的章节、练习和示例不创建占位文件或死链接。
示例代码标准
- 示例以
stage-00为最小运行起点,保留清楚可辨的scene、camera、renderer、geometry、material。无需动画的示例可按需渲染;需要时间变化时使用动画循环。 - 每个页面至少说明对应章节、预期画面、关键控件与启动路径。通过
particle-system/examples/目录的静态服务器即可打开,不依赖未声明的 CDN 或构建步骤。优先使用本地生成或仓库内已有素材,并注明许可或来源。 - 所有控制项有文本标签和当前数值;调整后画面要立即反馈。对照类示例应有明显可比的画面或切换方式。
- 动画使用以秒为单位的
deltaTime,而非假定固定帧率。需要固定步长、限幅或子步时明确原因。每帧更新循环尽量复用对象,避免反复创建Vector3等临时对象。 - 当代码设置
transparent、blending、depthTest、depthWrite、colorWrite或renderOrder时,说明它们分别影响什么;不要把renderOrder描述成逐粒子排序工具。 PointsMaterial.size在 r174 的 WebGL 实现中已乘像素比;自定义gl_PointSize时再明确处理像素比,并说明点大小的硬件范围。以屏幕像素还是世界单位描述尺寸时必须写清。- 顶点着色器根据初始属性和时间计算粒子状态,但不会把结果自动保存到下一帧;介绍有状态 GPU 模拟时单独说明数据反馈方案。
- 软粒子示例标出深度纹理来源、屏幕坐标与深度线性化过程,并解释透明物体通常不会自动进入同一深度纹理。
- 每次交付检查浏览器控制台、页面效果、控件、链接以及正文中的预期画面。涉及性能对比时记录条件,避免把单机测量写成普遍上限。
阶段完成标准
一个阶段只有在其正文、对应练习与参考答案、可运行示例、根目录索引和练习索引相互对应,并完成浏览器运行检查后,才标记为完成。阶段 00 没有章节练习,其验收范围是目录、运行说明、写作规范与最小场景。