From 4018597c92fc4c549e7b4dcfb690fbd8de605088 Mon Sep 17 00:00:00 2001 From: Don McCurdy Date: Sun, 22 Aug 2021 19:23:54 -0700 Subject: [PATCH 1/2] Support EXT_meshopt_compression --- packages/model-viewer/src/features/loading.ts | 14 ++++ .../src/three-components/CachingGLTFLoader.ts | 21 ++++++ .../model-viewer/src/types/meshoptimizer.ts | 10 +++ .../src/utilities/fetch-script.ts | 10 +++ packages/modelviewer.dev/data/docs.json | 10 ++- packages/modelviewer.dev/data/examples.json | 4 ++ .../examples/loading/index.html | 67 +++++++++++++++--- packages/shared-assets/models/coffeemat.glb | Bin 0 -> 4780672 bytes 8 files changed, 126 insertions(+), 10 deletions(-) create mode 100644 packages/model-viewer/src/types/meshoptimizer.ts create mode 100644 packages/model-viewer/src/utilities/fetch-script.ts create mode 100644 packages/shared-assets/models/coffeemat.glb diff --git a/packages/model-viewer/src/features/loading.ts b/packages/model-viewer/src/features/loading.ts index 31e50265c0..a94d59ca11 100644 --- a/packages/model-viewer/src/features/loading.ts +++ b/packages/model-viewer/src/features/loading.ts @@ -90,12 +90,14 @@ export declare interface LoadingInterface { export declare interface LoadingStaticInterface { dracoDecoderLocation: string; ktx2TranscoderLocation: string; + meshoptDecoderLocation: string; mapURLs(callback: (url: string) => string): void; } export interface ModelViewerGlobalConfig { dracoDecoderLocation?: string; ktx2TranscoderLocation?: string; + meshoptDecoderLocation?: string; powerPreference?: string; } @@ -168,6 +170,14 @@ export const LoadingMixin = >( return CachingGLTFLoader.getKTX2TranscoderLocation(); } + static set meshoptDecoderLocation(value: string) { + CachingGLTFLoader.setMeshoptDecoderLocation(value); + } + + static get meshoptDecoderLocation() { + return CachingGLTFLoader.getMeshoptDecoderLocation(); + } + /** * If provided, the callback will be passed each resource URL before a * request is sent. The callback may return the original URL, or a new URL @@ -319,6 +329,10 @@ export const LoadingMixin = >( ModelViewerElement.ktx2TranscoderLocation || DEFAULT_KTX2_TRANSCODER_LOCATION; CachingGLTFLoader.setKTX2TranscoderLocation(ktx2TranscoderLocation); + + if (ModelViewerElement.meshoptDecoderLocation) { + CachingGLTFLoader.setMeshoptDecoderLocation(ModelViewerElement.meshoptDecoderLocation); + } } connectedCallback() { diff --git a/packages/model-viewer/src/three-components/CachingGLTFLoader.ts b/packages/model-viewer/src/three-components/CachingGLTFLoader.ts index ef247de686..cd5ab68ef4 100644 --- a/packages/model-viewer/src/three-components/CachingGLTFLoader.ts +++ b/packages/model-viewer/src/three-components/CachingGLTFLoader.ts @@ -20,6 +20,7 @@ import {KTX2Loader} from 'three/examples/jsm/loaders/KTX2Loader'; import ModelViewerElementBase from '../model-viewer-base.js'; import {CacheEvictionPolicy} from '../utilities/cache-eviction-policy.js'; +import {fetchScript} from '../utilities/fetch-script.js'; import GLTFMaterialsVariantsExtension from './gltf-instance/VariantMaterialLoaderPlugin'; import {GLTFInstance, GLTFInstanceConstructor} from './GLTFInstance.js'; @@ -58,6 +59,9 @@ const dracoLoader = new DRACOLoader(); let ktx2TranscoderLocation: string; const ktx2Loader = new KTX2Loader(); +let meshoptDecoderLocation: string; +let meshoptDecoder: Promise | undefined; + export const $loader = Symbol('loader'); export const $evictionPolicy = Symbol('evictionPolicy'); const $GLTFInstance = Symbol('GLTFInstance'); @@ -83,6 +87,19 @@ export class CachingGLTFLoader MeshoptDecoder.ready) + .then(() => MeshoptDecoder); + } + } + + static getMeshoptDecoderLocation() { + return meshoptDecoderLocation; + } + static initializeKTX2Loader(renderer: WebGLRenderer) { ktx2Loader.detectSupport(renderer); } @@ -155,6 +172,10 @@ export class CachingGLTFLoader { progressCallback(progress * 0.8); diff --git a/packages/model-viewer/src/types/meshoptimizer.ts b/packages/model-viewer/src/types/meshoptimizer.ts new file mode 100644 index 0000000000..b07312e4a0 --- /dev/null +++ b/packages/model-viewer/src/types/meshoptimizer.ts @@ -0,0 +1,10 @@ +interface MeshoptDecoder { + ready: Promise; + supported: boolean; +} + +declare global { + const MeshoptDecoder: MeshoptDecoder; +} + +export {}; diff --git a/packages/model-viewer/src/utilities/fetch-script.ts b/packages/model-viewer/src/utilities/fetch-script.ts new file mode 100644 index 0000000000..d9f92efca4 --- /dev/null +++ b/packages/model-viewer/src/utilities/fetch-script.ts @@ -0,0 +1,10 @@ +export function fetchScript(src: string): Promise { + return new Promise((resolve, reject) => { + const script = document.createElement('script'); + document.body.appendChild(script); + script.onload = resolve; + script.onerror = reject; + script.async = true; + script.src = src; + }); +} diff --git a/packages/modelviewer.dev/data/docs.json b/packages/modelviewer.dev/data/docs.json index df3e8c3996..17acb2b660 100644 --- a/packages/modelviewer.dev/data/docs.json +++ b/packages/modelviewer.dev/data/docs.json @@ -112,7 +112,15 @@ "htmlName": "ktx2TranscoderLocation", "description": "This static, writable property sets <model-viewer>'s KTX2 transcoder location URL. By default, the KTX2 transcoder will be loaded from a Google CDN.", "links": [ - "dracoDecoderLocation example" + "ktx2TranscoderLocation example" + ] + }, + { + "name": "meshoptDecoderLocation", + "htmlName": "meshoptDecoderLocation", + "description": "This static, writable property sets <model-viewer>'s Meshopt decoder location URL. By default, the Meshopt decoder is not enabled.", + "links": [ + "meshoptDecoderLocation example" ] }, { diff --git a/packages/modelviewer.dev/data/examples.json b/packages/modelviewer.dev/data/examples.json index db18665490..5dd0443683 100644 --- a/packages/modelviewer.dev/data/examples.json +++ b/packages/modelviewer.dev/data/examples.json @@ -39,6 +39,10 @@ "htmlId": "ktx2Support", "name": "KTX2 Support" }, + { + "htmlId": "meshoptSupport", + "name": "Meshopt Support" + }, { "htmlId": "usdzModel", "name": "USDZ Model" diff --git a/packages/modelviewer.dev/examples/loading/index.html b/packages/modelviewer.dev/examples/loading/index.html index 61e26a6bd7..9133fbdaae 100644 --- a/packages/modelviewer.dev/examples/loading/index.html +++ b/packages/modelviewer.dev/examples/loading/index.html @@ -41,7 +41,7 @@ -
+
@@ -57,7 +57,7 @@

Display a poster until loaded

- +