[GLTF Serializer] Allow GLTF Exporter to export WebP images

[christaggart]

Adds JPEG and WEBP as valid optional mimetype options when serializing to a GLB.

Usage:
Add this to the dev host scene's button:

button1.onPointerUpObservable.add(function () {
        GLTF2Export.GLBAsync(scene, "webp.glb", {mimeType: ImageMimeType.WEBP}).then((glb) => {
            glb.downloadFiles();
          });
    });

Output as per gltf-transform inspect
PNG

TEXTURES
 ────────────────────────────────────────────
┌───┬─────────────────────────────────────┬─────┬──────────────────────────┬───────────┬───────────┬────────────┬───────────┬──────────┐
│ # │ name                                │ uri │ slots                    │ instances │ mimeType  │ resolution │ size      │ gpuSize¹ │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼───────────┼────────────┼───────────┼──────────┤
│ 0 │ Material (Base Color) image         │     │ baseColorTexture         │ 1         │ image/png │ 1024x1024  │ 380.17 KB │ 5.59 MB  │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼───────────┼────────────┼───────────┼──────────┤
│ 1 │ Material (Metallic Roughness) image │     │ metallicRoughnessTexture │ 1         │ image/png │ 1024x1024  │ 2.66 MB   │ 5.59 MB  │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼───────────┼────────────┼───────────┼──────────┤
│ 2 │ Material (Normal) image             │     │ normalTexture            │ 1         │ image/png │ 1024x1024  │ 2.89 MB   │ 5.59 MB  │
└───┴─────────────────────────────────────┴─────┴──────────────────────────┴───────────┴───────────┴────────────┴───────────┴──────────┘

JPEG*

TEXTURES
 ────────────────────────────────────────────
┌───┬─────────────────────────────────────┬─────┬──────────────────────────┬───────────┬────────────┬────────────┬───────────┬──────────┐
│ # │ name                                │ uri │ slots                    │ instances │ mimeType   │ resolution │ size      │ gpuSize¹ │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼────────────┼────────────┼───────────┼──────────┤
│ 0 │ Material (Base Color) image         │     │ baseColorTexture         │ 1         │ image/jpeg │ 1024x1024  │ 42.62 KB  │ 5.59 MB  │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼────────────┼────────────┼───────────┼──────────┤
│ 1 │ Material (Metallic Roughness) image │     │ metallicRoughnessTexture │ 1         │ image/jpeg │ 1024x1024  │ 537.51 KB │ 5.59 MB  │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼────────────┼────────────┼───────────┼──────────┤
│ 2 │ Material (Normal) image             │     │ normalTexture            │ 1         │ image/jpeg │ 1024x1024  │ 584.05 KB │ 5.59 MB  │
└───┴─────────────────────────────────────┴─────┴──────────────────────────┴───────────┴────────────┴────────────┴───────────┴──────────┘

WEBP

TEXTURES
 ────────────────────────────────────────────
┌───┬─────────────────────────────────────┬─────┬──────────────────────────┬───────────┬────────────┬────────────┬───────────┬──────────┐
│ # │ name                                │ uri │ slots                    │ instances │ mimeType   │ resolution │ size      │ gpuSize¹ │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼────────────┼────────────┼───────────┼──────────┤
│ 0 │ Material (Base Color) image         │     │ baseColorTexture         │ 1         │ image/webp │ 1024x1024  │ 12.19 KB  │ 5.59 MB  │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼────────────┼────────────┼───────────┼──────────┤
│ 1 │ Material (Metallic Roughness) image │     │ metallicRoughnessTexture │ 1         │ image/webp │ 1024x1024  │ 375.18 KB │ 5.59 MB  │
├───┼─────────────────────────────────────┼─────┼──────────────────────────┼───────────┼────────────┼────────────┼───────────┼──────────┤
│ 2 │ Material (Normal) image             │     │ normalTexture            │ 1         │ image/webp │ 1024x1024  │ 418.08 KB │ 5.59 MB  │
└───┴─────────────────────────────────────┴─────┴──────────────────────────┴───────────┴────────────┴────────────┴───────────┴──────────┘

My first PR for this project, so let me know if I'm missing anything.

[azure-pipelines]

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

[azure-pipelines]

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

[azure-pipelines]

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

[azure-pipelines]

Snapshot stored with reference name:
refs/pull/13062/merge

Test environment:
https://babylonsnapshots.z22.web.core.windows.net/refs/pull/13062/merge/index.html

To test a playground add it to the URL, for example:

https://babylonsnapshots.z22.web.core.windows.net/refs/pull/13062/merge/index.html#WGZLGJ#4600

Links to test babylon tools with this snapshot:

https://playground.babylonjs.com/?snapshot=refs/pull/13062/merge
https://sandbox.babylonjs.com/?snapshot=refs/pull/13062/merge
https://gui.babylonjs.com/?snapshot=refs/pull/13062/merge
https://nme.babylonjs.com/?snapshot=refs/pull/13062/merge

To test the snapshot in the playground with a playground ID add it after the snapshot query string:

https://playground.babylonjs.com/?snapshot=refs/pull/13062/merge#BCU1XR#0

[sebavan]

just a tiny lint issue you can fix with npm run format:fix && npm run lint:fix and good to go