New Image() in gltfLoader on worker

KulEugene · April 3, 2025, 6:51am

Hello, I have a problem that when loading a model using GLTFLoader, one of the models crashes with an error. new Image() is not available in worker, and I have everything done through offScreenCanvas. Should I remove the special textures from the model or is there a solution?

Mugen87 · April 3, 2025, 11:13am

The EXT_texture_avif and EXT_texture_webp glTF extensions are not supported in Web Workers with GLTFLoader.

If you want to go that route, you need an updated version of the glTF asset that does not use the above extensions. Alternatively, you could use a custom version of GLTFLoader that implements both extensions with Web Worker support.

Mugen87 · April 3, 2025, 12:12pm

@donmccurdy Do you think we still need to explicitly test support for WebP? The detectSupport() is the one that relies on Image which isn’t supported in Workers.

github.com/mrdoob/three.js

examples/jsm/loaders/GLTFLoader.js

e06239286


      
          	detectSupport() {
          
          		if ( ! this.isSupported ) {
          
          			this.isSupported = new Promise( function ( resolve ) {
          
          				const image = new Image();
          
          				// Lossy test image. Support for lossy images doesn't guarantee support for all
          				// WebP images, unfortunately.
          				image.src = 'data:image/webp;base64,UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA';
          
          				image.onload = image.onerror = function () {
          
          					resolve( image.height === 1 );
          
          				};
          
          			} );

This file has been truncated. show original

According to caniuse, WebP support looks excellent nowadays.

donmccurdy · April 3, 2025, 1:54pm

@Mugen87 I’d be fine with removing the WebP check – yes. I think if users need to support these much older browsers they can create compatible versions of their assets. For AVIF maybe the same is true? Let’s just test that on the modern/evergreen browsers, I haven’t done much with AVIF so far.

Mugen87 · April 3, 2025, 2:34pm

According to caniuse AVIF is a so called “Baseline Feature” since January 2024. That means all latest devices and major browsers support it.

It seems we can risk removing the check for both WebP and AVIF. If someone complains, we can restore the check for AVIF.

Mugen87 · April 7, 2025, 8:40am

For future readers: The support detection of WebP and AVIF has been removed from GLTFLoader starting from r176. Respective PR:

github.com/mrdoob/three.js

GLTFLoader: Remove support detection for WebP and AVIF.

dev ← Mugen87:dev1

opened 02:08PM - 04 Apr 25 UTC

Mugen87

+2 -80

Related issue: https://discourse.threejs.org/t/new-image-in-gltfloader-on-worker…/80639/3 **Description** This PR removes support detection for WebP and AVIF, in `GLTFLoader`. As discussed in the forum, both image formats are properly supported in recent browsers. The removal means both glTF extensions do not rely on the `Image` API anymore which improves Web Worker support. If users must support older browsers, they have to provide compatible versions of their glTF assets.

The former usage of the Image API should not cause any issues in Web Workers anymore.

Topic		Replies	Views
Issues in loading a .glb file in a web worker Questions loaders , gltf-loader , web-worker	0	333	February 27, 2024
Texture Problem after compressing/transforming glb file with npx gltfjsx Questions gltf-loader	1	437	December 25, 2022
Ideas for loading glb models in an offscreen canvas Questions gltf-loader , webworker	0	198	February 27, 2024
Loading model via GLTFLoader with 0.133 throws CSP Error in my web plugin Questions gltf-loader	3	939	July 20, 2022
GLTFLoader: Couldn't load texture textures/body_normal.jpeg Questions gltf-loader , vue	4	2197	May 27, 2024

New Image() in gltfLoader on worker

Related topics