@needle-tools/gltf-progressive 3.1.0-next.f550970 → 3.1.1-next.80f25bb

package/lib/extension.js

@@ -1,15 +1,18 @@
 import { BufferGeometry, Mesh, Texture, TextureLoader } from "three";
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { addDracoAndKTX2Loaders } from "./loaders.js";
-import { PromiseQueue, resolveUrl } from "./utils.internal.js";
+import { getParam, PromiseQueue, resolveUrl } from "./utils.internal.js";
 import { getRaycastMesh, registerRaycastMesh } from "./utils.js";
 // All of this has to be removed
 // import { getRaycastMesh, setRaycastMesh } from "../../engine_physics.js";
 // import { PromiseAllWithErrors, resolveUrl } from "../../engine_utils.js";
 import { plugins } from "./plugins/plugin.js";
 import { debug } from "./lods.debug.js";
-export const EXTENSION_NAME = "NEEDLE_progressive";
+import { getWorker } from "./worker/loader.mainthread.js";
+const useWorker = getParam("gltf-progressive-worker");
+const reduceMipmaps = getParam("gltf-progressive-reduce-mipmaps");
 const $progressiveTextureExtension = Symbol("needle-progressive-texture");
+export const EXTENSION_NAME = "NEEDLE_progressive";
 /**
  * The NEEDLE_progressive extension for the GLTFLoader is responsible for loading progressive LODs for meshes and textures.
  * This extension can be used to load different resolutions of a mesh or texture at runtime (e.g. for LODs or progressive textures).
@@ -83,6 +86,10 @@ export class NEEDLE_progressive {
                 }
             }
         }
+        else {
+            if (debug)
+                console.warn(`[getMaterialMinMaxLODsCount] Unsupported material type: ${material.type}`);
+        }
         material[cacheKey] = minmax;
         return minmax;
         function processTexture(tex, minmax) {
@@ -310,7 +317,7 @@ export class NEEDLE_progressive {
         return NEEDLE_progressive.getOrLoadLOD(current, level).then(tex => {
             // this can currently not happen
             if (Array.isArray(tex)) {
-                console.warn("Progressive: Got an array of textures for a texture slot, this should not happen", tex);
+                console.warn("Progressive: Got an array of textures for a texture slot, this should not happen...");
                 return null;
             }
             if (tex?.isTexture === true) {
@@ -328,6 +335,15 @@ export class NEEDLE_progressive {
                             }
                             // assigned.dispose();
                         }
+                        // Since we're switching LOD level for the texture based on distance we can avoid uploading all the mipmaps
+                        if (reduceMipmaps && tex.mipmaps) {
+                            const prevCount = tex.mipmaps.length;
+                            tex.mipmaps.length = Math.min(tex.mipmaps.length, 3);
+                            if (prevCount !== tex.mipmaps.length) {
+                                if (debug)
+                                    console.debug(`Reduced mipmap count from ${prevCount} to ${tex.mipmaps.length} for ${tex.uuid}: ${tex.image?.width}x${tex.image?.height}.`);
+                            }
+                        }
                         material[slot] = tex;
                     }
                     // check if the old texture is still used by other objects
@@ -510,6 +526,8 @@ export class NEEDLE_progressive {
     static previouslyLoaded = new Map();
     /** this contains the geometry/textures that were originally loaded */
     static lowresCache = new Map();
+    static workers = [];
+    static _workersIndex = 0;
     static async getOrLoadLOD(current, level) {
         const debugverbose = debug == "verbose";
         /** this key is used to lookup the LOD information */
@@ -521,8 +539,9 @@ export class NEEDLE_progressive {
         }
         const LODKEY = LOD?.key;
         let lodInfo;
+        const isTextureRequest = current.isTexture === true;
         // See https://github.com/needle-tools/needle-engine-support/issues/133
-        if (current.isTexture === true) {
+        if (isTextureRequest) {
             const tex = current;
             if (tex.source && tex.source[$progressiveTextureExtension])
                 lodInfo = tex.source[$progressiveTextureExtension];
@@ -564,6 +583,7 @@ export class NEEDLE_progressive {
                 }
                 // check if the requested file has already been loaded
                 const KEY = lod_url + "_" + lodInfo.guid;
+                const slot = await this.queue.slot(lod_url);
                 // check if the requested file is currently being loaded
                 const existing = this.previouslyLoaded.get(KEY);
                 if (existing !== undefined) {
@@ -602,7 +622,7 @@ export class NEEDLE_progressive {
                         return res;
                     }
                 }
-                const slot = await this.queue.slot(lod_url);
+                // #region loading
                 if (!slot.use) {
                     if (debug)
                         console.log(`LOD ${level} was aborted: ${lod_url}`);
@@ -610,6 +630,39 @@ export class NEEDLE_progressive {
                 }
                 const ext = lodInfo;
                 const request = new Promise(async (resolve, _) => {
+                    // const useWorker = true;
+                    if (useWorker) {
+                        const worker = await getWorker({});
+                        const res = await worker.load(lod_url);
+                        if (res.textures.length > 0) {
+                            // const textures = new Array<Texture>();
+                            for (const entry of res.textures) {
+                                let texture = entry.texture;
+                                NEEDLE_progressive.assignLODInformation(LOD.url, texture, LODKEY, level, undefined);
+                                if (current instanceof Texture) {
+                                    texture = this.copySettings(current, texture);
+                                }
+                                if (texture)
+                                    texture.guid = ext.guid;
+                                // textures.push(texture);
+                                return resolve(texture);
+                            }
+                            // if (textures.length > 0) {
+                            //     return resolve(textures);
+                            // }
+                        }
+                        if (res.geometries.length > 0) {
+                            const geometries = new Array();
+                            for (const entry of res.geometries) {
+                                const newGeo = entry.geometry;
+                                NEEDLE_progressive.assignLODInformation(LOD.url, newGeo, LODKEY, level, entry.primitiveIndex);
+                                geometries.push(newGeo);
+                            }
+                            return resolve(geometries);
+                        }
+                        return resolve(null);
+                    }
+                    // Old loading
                     const loader = new GLTFLoader();
                     addDracoAndKTX2Loaders(loader);
                     if (debug) {
@@ -686,7 +739,6 @@ export class NEEDLE_progressive {
                         }
                         if (found) {
                             const mesh = await parser.getDependency("mesh", index);
-                            const meshExt = ext;
                             if (debugverbose)
                                 console.log(`Loaded Mesh \"${mesh.name}\"`, lod_url, index, mesh, KEY);
                             if (mesh.isMesh === true) {
@@ -745,7 +797,8 @@ export class NEEDLE_progressive {
         }
         return null;
     }
-    static queue = new PromiseQueue(100, { debug: debug != false });
+    static maxConcurrent = 50;
+    static queue = new PromiseQueue(NEEDLE_progressive.maxConcurrent, { debug: debug != false });
     static assignLODInformation(url, res, key, level, index) {
         if (!res)
             return;
@@ -782,8 +835,8 @@ export class NEEDLE_progressive {
         // This should only happen once ever for every texture
         // const original = target;
         {
-            if (debug)
-                console.warn("Copy texture settings\n", source.uuid, "\n", target.uuid);
+            if (debug === "verbose")
+                console.debug("Copy texture settings\n", source.uuid, "\n", target.uuid);
             target = target.clone();
         }
         // else {

package/lib/loaders.d.ts

@@ -2,6 +2,14 @@ import { WebGLRenderer } from 'three';
 import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js';
 import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
 import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js';
+/**
+ * Return the current loader configuration.
+ * These paths can be changed using `setDracoDecoderLocation` and `setKTX2TranscoderLocation`.
+ */
+export declare const GET_LOADER_LOCATION_CONFIG: () => {
+    dracoDecoderPath: string;
+    ktx2TranscoderPath: string;
+};
 /**
  * Set the location of the Draco decoder. If a draco loader has already been created, it will be updated.
  * @default 'https://www.gstatic.com/draco/versioned/decoders/1.5.7/'

package/lib/loaders.js

@@ -6,6 +6,7 @@ let DEFAULT_DRACO_DECODER_LOCATION = 'https://www.gstatic.com/draco/versioned/de
 let DEFAULT_KTX2_TRANSCODER_LOCATION = 'https://www.gstatic.com/basis-universal/versioned/2021-04-15-ba1c3e4/';
 const defaultDraco = DEFAULT_DRACO_DECODER_LOCATION;
 const defaultKTX2 = DEFAULT_KTX2_TRANSCODER_LOCATION;
+// #region Online check
 const _remoteDracoDecoderUrl = new URL(DEFAULT_DRACO_DECODER_LOCATION + "draco_decoder.js");
 // if (typeof window !== "undefined") {
 //     if (!window.navigator.onLine) {
@@ -40,6 +41,15 @@ fetch(_remoteDracoDecoderUrl, {
     .finally(() => {
     prepareLoaders();
 });
+// #region Loader Configuration
+/**
+ * Return the current loader configuration.
+ * These paths can be changed using `setDracoDecoderLocation` and `setKTX2TranscoderLocation`.
+ */
+export const GET_LOADER_LOCATION_CONFIG = () => ({
+    dracoDecoderPath: DEFAULT_DRACO_DECODER_LOCATION,
+    ktx2TranscoderPath: DEFAULT_KTX2_TRANSCODER_LOCATION
+});
 /**
  * Set the location of the Draco decoder. If a draco loader has already been created, it will be updated.
  * @default 'https://www.gstatic.com/draco/versioned/decoders/1.5.7/'
@@ -72,28 +82,6 @@ export function setKTX2TranscoderLocation(location) {
         console.debug("Setting KTX2 transcoder path to " + location);
     }
 }
-const $dracoDecoderPath = Symbol("dracoDecoderPath");
-let dracoLoader;
-let meshoptDecoder;
-let ktx2Loader;
-/** Used to create and load loaders */
-function prepareLoaders() {
-    if (!dracoLoader) {
-        dracoLoader = new DRACOLoader();
-        dracoLoader[$dracoDecoderPath] = DEFAULT_DRACO_DECODER_LOCATION;
-        dracoLoader.setDecoderPath(DEFAULT_DRACO_DECODER_LOCATION);
-        dracoLoader.setDecoderConfig({ type: 'js' });
-        dracoLoader.preload();
-    }
-    if (!ktx2Loader) {
-        ktx2Loader = new KTX2Loader();
-        ktx2Loader.setTranscoderPath(DEFAULT_KTX2_TRANSCODER_LOCATION);
-        ktx2Loader.init();
-    }
-    if (!meshoptDecoder) {
-        meshoptDecoder = MeshoptDecoder;
-    }
-}
 /**
  * Create loaders/decoders for Draco, KTX2 and Meshopt to be used with GLTFLoader.
  * @param renderer - Provide a renderer to detect KTX2 support.
@@ -116,6 +104,29 @@ export function addDracoAndKTX2Loaders(loader) {
     if (!loader.meshoptDecoder)
         loader.setMeshoptDecoder(meshoptDecoder);
 }
+// #region internal
+const $dracoDecoderPath = Symbol("dracoDecoderPath");
+let dracoLoader;
+let meshoptDecoder;
+let ktx2Loader;
+/** Used to create and load loaders */
+function prepareLoaders() {
+    if (!dracoLoader) {
+        dracoLoader = new DRACOLoader();
+        dracoLoader[$dracoDecoderPath] = DEFAULT_DRACO_DECODER_LOCATION;
+        dracoLoader.setDecoderPath(DEFAULT_DRACO_DECODER_LOCATION);
+        dracoLoader.setDecoderConfig({ type: 'js' });
+        dracoLoader.preload();
+    }
+    if (!ktx2Loader) {
+        ktx2Loader = new KTX2Loader();
+        ktx2Loader.setTranscoderPath(DEFAULT_KTX2_TRANSCODER_LOCATION);
+        ktx2Loader.init();
+    }
+    if (!meshoptDecoder) {
+        meshoptDecoder = MeshoptDecoder;
+    }
+}
 const gltfLoaderConfigurations = new WeakMap();
 export function configureLoader(loader, opts) {
     let config = gltfLoaderConfigurations.get(loader);

package/lib/lods.manager.js

@@ -160,6 +160,14 @@ export class LODsManager {
     constructor(renderer, context) {
         this.renderer = renderer;
         this.context = { ...context };
+        // createGLTFLoaderWorker().then(res => {
+        //     res.load("https://cloud.needle.tools/-/assets/Z23hmXBZ20RjNk-Z20RjNk-optimized/file").then(res2 => {
+        //         console.log("DONE", res2);
+        //     })
+        //     res.load("https://cloud.needle.tools/-/assets/Z23hmXBZ20RjNk-Z20RjNk-world/file").then(res2 => {
+        //         console.log("DONE2", res2);
+        //     })
+        // })
     }
     #originalRender;
     #clock = new Clock();
@@ -360,7 +368,7 @@ export class LODsManager {
         }
         // TODO: we currently can not switch texture lods because we need better caching for the textures internally (see copySettings in progressive + NE-4431)
         if (object.material && levels.texture_lod >= 0) {
-            this.loadProgressiveTextures(object.material, levels.texture_lod);
+            this.loadProgressiveTextures(object.material, levels.texture_lod, debugLodLevel);
         }
         if (debug && object.material && !object["isGizmo"]) {
             applyDebugSettings(object.material);
@@ -376,7 +384,7 @@ export class LODsManager {
      * @param level the LOD level to load. Level 0 is the best quality, higher levels are lower quality
      * @returns Promise with true if the LOD was loaded, false if not
      */
-    loadProgressiveTextures(material, level) {
+    loadProgressiveTextures(material, level, overrideLodLevel) {
         if (!material)
             return;
         if (Array.isArray(material)) {
@@ -394,10 +402,9 @@ export class LODsManager {
         else if (level < material[$currentLOD]) {
             update = true;
         }
-        const debugLevel = material["DEBUG:LOD"];
-        if (debugLevel != undefined) {
-            update = material[$currentLOD] != debugLevel;
-            level = debugLevel;
+        if (overrideLodLevel !== undefined && overrideLodLevel >= 0) {
+            update = material[$currentLOD] != overrideLodLevel;
+            level = overrideLodLevel;
         }
         if (update) {
             material[$currentLOD] = level;
@@ -459,6 +466,7 @@ export class LODsManager {
     }
     static skinnedMeshBoundsFrameOffsetCounter = 0;
     static $skinnedMeshBoundsOffset = Symbol("gltf-progressive-skinnedMeshBoundsOffset");
+    // #region calculateLodLevel
     calculateLodLevel(camera, mesh, state, desiredDensity, result) {
         if (!mesh) {
             result.mesh_lod = -1;
@@ -485,7 +493,7 @@ export class LODsManager {
         const primitive_index = NEEDLE_progressive.getPrimitiveIndex(mesh.geometry);
         const has_mesh_lods = mesh_lods && mesh_lods.length > 0;
         const texture_lods_minmax = NEEDLE_progressive.getMaterialMinMaxLODsCount(mesh.material);
-        const has_texture_lods = texture_lods_minmax?.min_count != Infinity && texture_lods_minmax.min_count > 0 && texture_lods_minmax.max_count > 0;
+        const has_texture_lods = texture_lods_minmax.min_count !== Infinity && texture_lods_minmax.min_count >= 0 && texture_lods_minmax.max_count >= 0;
         // We can skip all this if we dont have any LOD information
         if (!has_mesh_lods && !has_texture_lods) {
             result.mesh_lod = 0;
@@ -675,7 +683,7 @@ export class LODsManager {
             if (changed) {
                 const level = mesh_lods?.[result.mesh_lod];
                 if (level) {
-                    console.log(`Mesh LOD changed: ${state.lastLodLevel_Mesh} → ${result.mesh_lod} (${level.density.toFixed(0)}) - ${mesh.name}`);
+                    console.debug(`Mesh LOD changed: ${state.lastLodLevel_Mesh} → ${result.mesh_lod} (density: ${level.densities?.[primitive_index].toFixed(0)}) | ${mesh.name}`);
                 }
             }
         }
@@ -710,10 +718,11 @@ export class LODsManager {
                     if (lod.max_height > pixelSizeOnScreen || (!foundLod && i === 0)) {
                         foundLod = true;
                         result.texture_lod = i;
-                        if (result.texture_lod < state.lastLodLevel_Texture) {
-                            const lod_pixel_height = lod.max_height;
-                            if (debugProgressiveLoading)
+                        if (debugProgressiveLoading) {
+                            if (result.texture_lod < state.lastLodLevel_Texture) {
+                                const lod_pixel_height = lod.max_height;
                                 console.log(`Texture LOD changed: ${state.lastLodLevel_Texture} → ${result.texture_lod} = ${lod_pixel_height}px \nScreensize: ${pixelSizeOnScreen.toFixed(0)}px, Coverage: ${(100 * state.lastScreenCoverage).toFixed(2)}%, Volume ${volume.toFixed(1)} \n${mesh.name}`);
+                            }
                         }
                         break;
                     }

package/lib/utils.internal.d.ts

@@ -4,10 +4,10 @@ export declare function resolveUrl(source: string | undefined, uri: string): str
 /** @returns `true` if it's a phone or tablet */
 export declare function isMobileDevice(): boolean;
 export declare function isDevelopmentServer(): boolean;
-type SlotReturnValue = {
-    use?: ((promise: Promise<any>) => void);
+export type SlotReturnValue<T = any> = {
+    use?: ((promise: Promise<T>) => void);
 };
-export declare class PromiseQueue {
+export declare class PromiseQueue<T = any> {
     readonly maxConcurrent: number;
     private readonly _running;
     private readonly _queue;
@@ -19,8 +19,7 @@ export declare class PromiseQueue {
     /**
      * Request a slot for a promise with a specific key. This function returns a promise with a `use` method that can be called to add the promise to the queue.
      */
-    slot(key: string): Promise<SlotReturnValue>;
+    slot(key: string): Promise<SlotReturnValue<T>>;
     private add;
     private internalUpdate;
 }
-export {};

package/lib/version.js

@@ -1,4 +1,4 @@
 // replaced at build time
-export const version = "3.1.0";
+export const version = "3.1.1";
 globalThis["GLTF_PROGRESSIVE_VERSION"] = version;
 console.debug(`[gltf-progressive] version ${version || "-"}`);

package/lib/worker/loader.mainthread.d.ts

@@ -0,0 +1,46 @@
+import { BufferGeometry, Texture, WebGLRenderer } from "three";
+import type { KTX2LoaderWorkerConfig } from "three/examples/jsm/loaders/KTX2Loader.js";
+type GLTFLoaderWorkerOptions = {
+    debug?: boolean;
+};
+type WorkerLoadResult = {
+    url: string;
+    geometries: Array<{
+        geometry: BufferGeometry;
+        meshIndex: number;
+        primitiveIndex: number;
+        extensions: Record<string, any>;
+    }>;
+    textures: Array<{
+        texture: Texture;
+        textureIndex: number;
+        extensions: Record<string, any>;
+    }>;
+};
+export declare function getWorker(opts?: GLTFLoaderWorkerOptions): Promise<GLTFLoaderWorker>;
+export type { GLTFLoaderWorker, GLTFLoaderWorkerOptions, WorkerLoadResult };
+/** @internal */
+export type GLTFLoaderWorker_Message = {
+    type: 'init';
+} | {
+    type: 'load';
+    url: string;
+    dracoDecoderPath: string;
+    ktx2TranscoderPath: string;
+    ktx2LoaderConfig: KTX2LoaderWorkerConfig;
+} | {
+    type: "loaded-gltf";
+    result: WorkerLoadResult;
+};
+declare class GLTFLoaderWorker {
+    private readonly worker;
+    private static workerUrl;
+    static createWorker(opts: GLTFLoaderWorkerOptions): Promise<GLTFLoaderWorker>;
+    private _running;
+    private _webglRenderer;
+    load(url: string | URL, opts?: {
+        renderer?: WebGLRenderer;
+    }): Promise<WorkerLoadResult>;
+    private _debug;
+    private constructor();
+}

package/lib/worker/loader.mainthread.js

@@ -0,0 +1,201 @@
+import { Box3, BufferAttribute, BufferGeometry, CompressedTexture, InterleavedBuffer, InterleavedBufferAttribute, Matrix3, Sphere, Texture, Vector3 } from "three";
+import { createLoaders, GET_LOADER_LOCATION_CONFIG } from "../loaders.js";
+import { isMobileDevice } from "../utils.internal.js";
+import { debug } from "../lods.debug.js";
+const workers = new Array();
+let getWorkerId = 0;
+const maxWorkers = isMobileDevice() ? 2 : 10;
+export function getWorker(opts) {
+    if (workers.length < maxWorkers) {
+        const index = workers.length;
+        if (debug)
+            console.warn(`[Worker] Creating new worker #${index}`);
+        const worker = GLTFLoaderWorker.createWorker(opts || {});
+        workers.push(worker);
+        return worker;
+    }
+    const index = (getWorkerId++) % workers.length;
+    const worker = workers[index];
+    return worker;
+}
+class GLTFLoaderWorker {
+    worker;
+    static workerUrl = null;
+    static async createWorker(opts) {
+        if (!GLTFLoaderWorker.workerUrl) {
+            GLTFLoaderWorker.workerUrl = await import(/* @vite-ignore */ `./loader.worker.js?url`).then(m => {
+                return (m.default || m).toString();
+            });
+            if (!GLTFLoaderWorker.workerUrl)
+                throw new Error("Failed to load GLTFLoaderWorker worker URL");
+        }
+        const worker = new Worker(new URL(GLTFLoaderWorker.workerUrl, import.meta.url), {
+            type: 'module',
+        });
+        const instance = new GLTFLoaderWorker(worker, opts);
+        return instance;
+    }
+    _running = [];
+    _webglRenderer = null;
+    async load(url, opts) {
+        const configs = GET_LOADER_LOCATION_CONFIG();
+        // Make sure we have a webgl renderer for the KTX transcoder feature detection
+        let renderer = opts?.renderer;
+        if (!renderer) {
+            this._webglRenderer ??= (async () => {
+                const { WebGLRenderer } = await import("three");
+                return new WebGLRenderer();
+            })();
+            renderer = await this._webglRenderer;
+        }
+        const loaders = createLoaders(renderer);
+        const ktx2Loader = loaders.ktx2Loader;
+        const ktx2LoaderConfig = ktx2Loader.workerConfig;
+        if (url instanceof URL) {
+            url = url.toString();
+        }
+        else if (url.startsWith("file:")) {
+            // make blob url
+            url = URL.createObjectURL(new Blob([url]));
+        }
+        else if (!url.startsWith("blob:") && !url.startsWith("http:") && !url.startsWith("https:")) {
+            url = new URL(url, window.location.href).toString();
+        }
+        const options = {
+            type: "load",
+            url: url,
+            dracoDecoderPath: configs.dracoDecoderPath,
+            ktx2TranscoderPath: configs.ktx2TranscoderPath,
+            ktx2LoaderConfig: ktx2LoaderConfig,
+        };
+        if (this._debug)
+            console.debug("[Worker] Sending load request", options);
+        this.worker.postMessage(options);
+        return new Promise(resolve => {
+            this._running.push({
+                url: url.toString(),
+                resolve,
+            });
+        });
+    }
+    _debug = false;
+    constructor(worker, _opts) {
+        this.worker = worker;
+        this._debug = _opts.debug ?? false;
+        worker.onmessage = (event) => {
+            const data = event.data;
+            if (this._debug)
+                console.log("[Worker] EVENT", data);
+            switch (data.type) {
+                case "loaded-gltf": {
+                    for (const promise of this._running) {
+                        if (promise.url === data.result.url) {
+                            // process received data and resolve
+                            processReceivedData(data.result);
+                            promise.resolve(data.result);
+                            // cleanup
+                            const url = promise.url;
+                            if (url.startsWith("blob:")) {
+                                URL.revokeObjectURL(url);
+                            }
+                        }
+                    }
+                }
+            }
+        };
+        worker.onerror = (error) => {
+            console.error("[Worker] Error in gltf-progressive worker:", error);
+        };
+        worker.postMessage({
+            type: 'init',
+        });
+    }
+}
+function processReceivedData(data) {
+    for (const res of data.geometries) {
+        const worker_geometry = res.geometry;
+        // console.log(worker_geometry)
+        const geo = new BufferGeometry();
+        geo.name = worker_geometry.name || "";
+        if (worker_geometry.index) {
+            const index = worker_geometry.index;
+            geo.setIndex(cloneAttribute(index));
+        }
+        // geo.drawRange = receivedGeometry.drawRange || { start: 0, count: Infinity };
+        for (const attrName in worker_geometry.attributes) {
+            const attribute = worker_geometry.attributes[attrName];
+            const clonedAttribute = cloneAttribute(attribute);
+            geo.setAttribute(attrName, clonedAttribute);
+        }
+        // handle morph attributes
+        // TODO: one slow aspect that could be moved to the worker is updating the morph target textures
+        if (worker_geometry.morphAttributes) {
+            for (const morphName in worker_geometry.morphAttributes) {
+                const morphAttributes = worker_geometry.morphAttributes[morphName];
+                const morphArray = morphAttributes.map(attribute => {
+                    return cloneAttribute(attribute);
+                });
+                geo.morphAttributes[morphName] = morphArray;
+            }
+        }
+        geo.morphTargetsRelative = worker_geometry.morphTargetsRelative ?? false;
+        geo.boundingBox = new Box3();
+        geo.boundingBox.min = new Vector3(worker_geometry.boundingBox?.min.x, worker_geometry.boundingBox?.min.y, worker_geometry.boundingBox?.min.z);
+        geo.boundingBox.max = new Vector3(worker_geometry.boundingBox?.max.x, worker_geometry.boundingBox?.max.y, worker_geometry.boundingBox?.max.z);
+        geo.boundingSphere = new Sphere(new Vector3(worker_geometry.boundingSphere?.center.x, worker_geometry.boundingSphere?.center.y, worker_geometry.boundingSphere?.center.z), worker_geometry.boundingSphere?.radius);
+        // // handle groups
+        if (worker_geometry.groups) {
+            for (const group of worker_geometry.groups) {
+                geo.addGroup(group.start, group.count, group.materialIndex);
+            }
+        }
+        // // handle user data
+        if (worker_geometry.userData) {
+            geo.userData = worker_geometry.userData;
+        }
+        res.geometry = geo;
+    }
+    for (const res of data.textures) {
+        const texture = res.texture;
+        let newTexture = null;
+        if (texture.isCompressedTexture) {
+            const mipmaps = texture.mipmaps;
+            const width = texture.image?.width || texture.source?.data?.width || -1;
+            const height = texture.image?.height || texture.source?.data?.height || -1;
+            newTexture = new CompressedTexture(mipmaps, width, height, texture.format, texture.type, texture.mapping, texture.wrapS, texture.wrapT, texture.magFilter, texture.minFilter, texture.anisotropy, texture.colorSpace);
+        }
+        else {
+            newTexture = new Texture(texture.image, texture.mapping, texture.wrapS, texture.wrapT, texture.magFilter, texture.minFilter, texture.format, texture.type, texture.anisotropy, texture.colorSpace);
+            newTexture.mipmaps = texture.mipmaps;
+            newTexture.channel = texture.channel;
+            newTexture.source.data = texture.source.data;
+            newTexture.flipY = texture.flipY;
+            newTexture.premultiplyAlpha = texture.premultiplyAlpha;
+            newTexture.unpackAlignment = texture.unpackAlignment;
+            newTexture.matrix = new Matrix3(...texture.matrix.elements);
+        }
+        if (!newTexture) {
+            console.error("[Worker] Failed to create new texture from received data. Texture is not a CompressedTexture or Texture.");
+            continue;
+        }
+        res.texture = newTexture;
+    }
+    return data;
+}
+function cloneAttribute(attribute) {
+    let res = attribute;
+    if ("isInterleavedBufferAttribute" in attribute && attribute.isInterleavedBufferAttribute) {
+        const data = attribute.data;
+        const array = data.array;
+        const interleavedBuffer = new InterleavedBuffer(array, data.stride);
+        res = new InterleavedBufferAttribute(interleavedBuffer, attribute.itemSize, array.byteOffset, attribute.normalized);
+        res.offset = attribute.offset;
+    }
+    else if ("isBufferAttribute" in attribute && attribute.isBufferAttribute) {
+        res = new BufferAttribute(attribute.array, attribute.itemSize, attribute.normalized);
+        res.usage = attribute.usage;
+        res.gpuType = attribute.gpuType;
+        res.updateRanges = attribute.updateRanges;
+    }
+    return res;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@needle-tools/gltf-progressive",
-  "version": "3.1.0-next.f550970",
+  "version": "3.1.1-next.80f25bb",
   "description": "three.js support for loading glTF or GLB files that contain progressive loading data",
   "homepage": "https://needle.tools",
   "author": {