IFC BIM瓦片几何流加载实现验证：加载性能未提升

我基于Open BIM Components Library实现了仅BIM瓦片几何流加载方案，控制台未检测到报错，但完全未感知到加载性能提升，恳请确认当前实现是否合规。

实现代码 #

export class frag_loader{  
     static streamIFCgeom: StreamedGeometries = {
           assets: [],
           geometries: {},
           globalDataFileId:
            "xxxxxx.ifc-processed-global",
     };

///...
static async initLoading(
ifcLoader: OBC.FragmentIfcLoader,
viewer: OBC.Components,
streamer?: OBC.FragmentIfcStreamConverter,
streamLoader?: OBC.FragmentStreamLoader
){
    const arrBuffer =
      await ifcLoaderService.fetchIFCfile();
    const model = await ifcLoader.load(arrBuffer);
    viewer.scene.get().add(model);
      streamer.onGeometryStreamed.add(
        (geometry) => {
          for (const [
            key,
            value,
          ] of Object.entries(geometry)) {
            if (key === "data") {
              const geometries =
                value as OBC.StreamedGeometries;
              const geometryObj: {
                [id: number]: {
                  boundingBox: {
                    [id: number]: number;
                  };
                  hasHoles: boolean;
                  geometryFile: string;
                };
              } = {};
              for (const [
                id,
                data,
              ] of Object.entries(geometries)) {
                const idNumb = Number(id);
                const bb = data.boundingBox;
                const holes = data.hasHoles;
                const globalDataName =
                  "xxxxx.ifc-processed-geometries";
                frag_loader.streamIFCgeom.geometries[
                  idNumb
                ] = {
                  boundingBox: bb,
                  hasHoles: holes,
                  geometryFile: globalDataName,
                };
              }
            }
          }
        }
      );
      streamer.onAssetStreamed.add(
        (assets: OBC.StreamedAsset[]) => {
          frag_loader.streamIFCgeom.assets =
            frag_loader.streamIFCgeom.assets.concat(
              assets
            );
        }
      );

      await streamer.streamFromBuffer(arrBuffer);
      streamLoader.url =
        environment.VITE_API_URL + "/";
      await streamLoader.load(
        frag_loader.streamIFCgeom as OBC.StreamLoaderSettings,
        true
      );
      (
        viewer.camera as OBC.OrthoPerspectiveCamera
      ).controls.addEventListener(
        "controlend",
        () => {
          streamLoader.culler.needsUpdate = true;
        }
      );
}
}

后端配置 #

我的后端端点：http://localhost:3000/xxxx.ifc-processed-global，返回的JSON数据对应xxxxxx.ifc-processed.json，数据格式截图如下：

核心问题与修正方案 #

1. 性能无提升的根本原因：冗余全量加载 #

你先通过ifcLoader.load(arrBuffer)将整个IFC模型全量加载并添加到场景，这直接抵消了流加载的核心优势——流加载本应只加载当前视口可见的瓦片，而全量加载后后续流加载操作完全失去意义，自然看不到性能提升。必须删除这两行代码：

const model = await ifcLoader.load(arrBuffer);
viewer.scene.get().add(model);

2. 几何数据收集逻辑错误 #

onGeometryStreamed回调的参数直接是单个几何条目，无需遍历Object.entries(geometry)查找data键，原逻辑会导致几何数据收集不完整或错误。修正后的回调逻辑：

streamer.onGeometryStreamed.add((geometry) => {
    const idNumb = geometry.id;
    frag_loader.streamIFCgeom.geometries[idNumb] = {
        boundingBox: geometry.boundingBox,
        hasHoles: geometry.hasHoles,
        geometryFile: "xxxxx.ifc-processed-geometries",
    };
});

3. 修正后的完整核心代码 #

export class frag_loader{  
     static streamIFCgeom: StreamedGeometries = {
           assets: [],
           geometries: {},
           globalDataFileId: "xxxxxx.ifc-processed-global",
     };

static async initLoading(
ifcLoader: OBC.FragmentIfcLoader,
viewer: OBC.Components,
streamer?: OBC.FragmentIfcStreamConverter,
streamLoader?: OBC.FragmentStreamLoader
){
    const arrBuffer = await ifcLoaderService.fetchIFCfile();
    
    // 先注册回调
    streamer.onGeometryStreamed.add((geometry) => {
        const idNumb = geometry.id;
        frag_loader.streamIFCgeom.geometries[idNumb] = {
            boundingBox: geometry.boundingBox,
            hasHoles: geometry.hasHoles,
            geometryFile: "xxxxx.ifc-processed-geometries",
        };
    });
    
    streamer.onAssetStreamed.add((assets: OBC.StreamedAsset[]) => {
        frag_loader.streamIFCgeom.assets = frag_loader.streamIFCgeom.assets.concat(assets);
    });

    // 执行流转换
    await streamer.streamFromBuffer(arrBuffer);
    
    // 配置并加载流数据
    streamLoader.url = environment.VITE_API_URL + "/";
    await streamLoader.load(frag_loader.streamIFCgeom as OBC.StreamLoaderSettings, true);
    
    // 绑定视口更新触发裁剪
    (viewer.camera as OBC.OrthoPerspectiveCamera).controls.addEventListener(
        "controlend",
        () => {
            streamLoader.culler.needsUpdate = true;
        }
    );
}
}

4. 额外验证点 #

• 确认后端返回的全局数据格式符合OBC要求，包含正确的几何分片映射、元数据。
• 查看浏览器网络请求，确认流加载时仅请求当前视口内的瓦片文件，而非一次性加载所有数据。
• 确保streamLoader.culler.enabled为true（默认开启），保证视口裁剪逻辑生效。

内容的提问来源于stack exchange，提问作者MiguelG