12-mini版WebGLObjects

源码:github.com/buglas/thre...

1-WebGLObjectsMini的代码

src\renderers\webgl\WebGLObjectsMini.js

php 复制代码
/**
 * 物体级几何体更新:从 Mesh 取出 geometry,触发 GPU buffer 同步。
 * geometries: WebGLGeometriesMini
 */
function WebGLObjectsMini( geometries ) {
    //object:Mesh
    function update( object ) {
        // 从Mesh中取出geometry
        const geometry = object.geometry;
        // 从geometries中取出buffergeometry
        const buffergeometry = geometries.get( geometry );
        // 更新buffergeometry
        geometries.update( buffergeometry );
        // 返回buffergeometry
        return buffergeometry;
    }
    return {
        update: update
    };
}
​
export { WebGLObjectsMini };

2-WebGLObjectsMini 的功能定位

WebGLObjects 是WebGL 渲染器里的一个对象更新协调器。

在真正绘制某个 Object3D 之前,WebGLRenderer 会调用它的 update(object),确保该物体相关的 GPU 数据已经准备好。

WebGLObjects 的整体定位:

arduino 复制代码
场景遍历 (projectObject)
    ↓
objects.update(mesh)          ← WebGLObjectsMini
    ↓
geometries.get + update       ← WebGLGeometriesMini
    ↓
attributes.update             ← WebGLAttributesMini(真正写 GPU buffer)
    ↓
渲染列表 → renderBufferDirect → drawArrays

WebGLObjectsMini 亦是如此,只是具体功能做了删减。

WebGLObjectsMini 的核心职责:在渲染前,把 Mesh 上的 geometry 同步到 GPU。它本身不直接操作 WebGL,而是委托给 WebGLGeometriesMini

3-update() 方法

ini 复制代码
function update( object ) {
    const geometry = object.geometry;
    const buffergeometry = geometries.get( geometry );
    geometries.update( buffergeometry );
    return buffergeometry;
}

update 做三件事:

  1. 调用object.geometry,从 Mesh 取出几何体。
  2. 调研geometries.get(geometry),注册/获取几何体,首次会挂 dispose 监听。
  3. geometries.update(buffergeometry),把 position 等 attribute 上传到 GPU。

4-与完整版 WebGLObjects.js 的对比

完整版更复杂,Mini 版只保留了最基础路径:

能力 WebGLObjectsMini WebGLObjects(完整版)
基础 Mesh 几何体更新
每帧只更新一次(WeakMap + frame ❌ 每次遍历都调 update
InstancedMesh(实例矩阵)
SkinnedMesh(骨骼)
geometries.get(object, geometry) 只传 geometry objectgeometry
相关推荐
李伟_Li慢慢1 小时前
17-mini版WebGLBufferRenderer
前端·three.js
李伟_Li慢慢1 小时前
16-mini版WebGLBackground
前端·three.js
李伟_Li慢慢1 小时前
13-mini版WebGLProgram
前端·three.js
李伟_Li慢慢1 小时前
14-mini版WebGLPrograms
前端·three.js
李伟_Li慢慢1 小时前
19-mini版WebGLRenderer
前端·three.js
李伟_Li慢慢2 小时前
10-mini版bindingStates
前端·three.js
李伟_Li慢慢2 小时前
08-BufferAttribute
前端·three.js
李伟_Li慢慢2 小时前
09-mini版WebGLAttributes
前端·three.js
李伟_Li慢慢2 小时前
11-mini版WebGLGeometries
前端·three.js