Automatic low-polygon reduction for GLB models

The CodeSandbox above uses a very old version of three.js, so I think you’d need to read through the old/new SimplifyModifier very carefully and update the new one to support UVs. It may be a lot of work.

gltfpack is the easiest option I know of, if you are able to do simplification on the command line:

For something that runs in JavaScript (web or node.js), you could use glTF Transform. You’d load the model with WebIO instead of GLTFLoader, then clone and simplify it as many times as you need:

import { WebIO } from '@gltf-transform/core';
import { simplify, weld } from '@gltf-transform/functions';
import { MeshoptSimplifier } from 'meshoptimizer';

const io = new WebiO();
const document = await io.read('path/to/model.glb');
const document2 = document.clone();

// simplify a lot
await document.transform(
  weld({ tolerance: 0.01 }),
  simplify({ simplifier: MeshoptSimplifier, ratio: 0.01, error: 0.01 })
);

// simplify a little
await document2.transform(
  weld({ tolerance: 0.0001 }),
  simplify({ simplifier: MeshoptSimplifier, ratio: 0.01, error: 0.0001 })
);

Then use WebIO to write a GLB, download that or parse it with GLTFLoader or whatever you need.

1 Like