Using webp with gltf

Hello guys,

since we are using web3D file size is always an important point to consider. I had in mind to use webp files as textures instead of jpg and png. I am glad that gltf does already support webp with an extension (glTF/extensions/2.0/Vendor/EXT_texture_webp at master · KhronosGroup/glTF · GitHub).

Unfortunately babylon throws an error: Require extension EXT_texture_webp is not available

It seems that this extension isn’t supported yet (Extensions - Babylon.js Documentation).

Is anyone willing either to implement it or to explain how to do it?

I appreciate your help very much!

Best

1 Like

I am pretty sure I am using webp, the format of one frame of VP8 codec, for my video capture work flow. It only works on Chrome. Have you tried it on that browser?

FYI, extensions have to be supported at the browser level and higher. Not something doable at applications level. I saw that Safari has started to support it. Think you should re-think your plans.

I didn’t even know that this image format existed…

It seems the native browser support is not that bad:

Only Safari is lacking, support is coming with iOS 14.

Correction, this is not a Webgl extension, but gltf, so yes it is implemented below the browser level. Unless it is easily searched on how to convert to a 2 dimension array of values, it might be challenging.

I would say to just rely on the browser support, and if not raise an error if the extension is tagged “required”: it would make for an easy implementation and would still provide support for the major browsers.

Yes, meanwhile webp is supported by most browser at newest version and Safari will follow soon. The compression is massive wherefore I would love to use it with babylon.

The gltf extension I mentioned above allows to load the webp if the browser supports it and if not it uses a fallback to load the jpg or png.

Cesium integrated it last year: Faster and Smaller 3D Tiles with WebP Image Compression | cesium.com

Pinging @bghgary as this seems a great plugin to add

2 Likes

I created a feature request on git:

4 Likes

I can tackle it but I’ll need a glb to test

Sounds good. Thank you!

I wasn’t able to create a glb but a gltf with seperated textures: Gofile
The webp texture is different from the png one in this case.

I wasn’t able to test it because I can’t find a gltf viewer that supports this extension.

I hope this helps.

2 Likes

Full Necro: Is this implemented?

1 Like

Yes, webp support has been added in the file loader, so it’s available for regular textures and in gltf/glb files.

3 Likes

Cool because Im talking to @MackeyK24 about adding support to the Unity Toolkit. One of my coworkers showed we the compression savings with webp and I got excited.

Please tell me, is auto-selection of textures possible? If it does not support webp, then download png, do not download all textures at once.

If you are using glTF files, yes, webp support is an extension, so if it’s not availalbe it will fall back to a default texture (if you provided one!).

Webp is working. For some reason both web and png files are loaded from the server together. I would like to download only webp if the browser supports it.

"textures": [
    {
        "source": 0,
        "extensions": {
            "EXT_texture_webp": {
                "source": 1
            }
        }
    }
],
"images": [
    {
        "uri": "image.png"
    },
    {
        "uri": "image.webp"
    }
]

cc @bghgary, I don’t know if it’s the expected behavior of the loader.

Sorry, was on vacation. That is certainly not the expected behavior. Do you have an example glTF I can test?

I don’t see this happening in this playground: https://playground.babylonjs.com/#LSAUH2#2. @amobi If you can provide a repro, I will investigate.

1 Like