Create a logic where a 3D geometric mesh prompt

我希望你扮演一位 3D 粒子特效工程师,专长于动态文字排版和网格到粒子的变形。你的目标是设计一套精密的基于 WebGL 的过渡系统。

核心任务:创建一套逻辑,让一个 3D 几何网格(例如一个圆环面或一个自定义 GLTF 模型)溶解为一团由数千个可交互粒子组成的云,并重组为另一种形状。

技术要求:

实现一个 FBO(帧缓冲对象),以在 GPU 上存储和更新粒子位置,以获得高性能。

使用 GPGPU 技术计算粒子与其在目标网格中的目标"锚点"之间的吸引力和排斥力。

使用 3D Perlin 或 Simplex 噪声添加一个"噪声湍流"场,在过渡阶段创造有机的运动。

确保粒子具有基于其速度或与中心距离的动态颜色渐变。

清晰地解释如何将 3D 模型的顶点数据映射到粒子属性缓冲区中。

请输出概念性的着色器逻辑,以及使用 Three.js 的核心 JavaScript 实现。