GLB file exported is 3 to 4 times larger than scene objects/ original file

First of all, l want to mention that I’m a beginner to Three.js so please bear with me if l’m not aware of any concepts. I will outline my thought process and all the resources l have referred to.

So my issue is with the exporting functionality. The objects on the model are around 10 to 13mb before exporting, but l separated them and uploaded onto a scene where l can export if required. But now on exporting, l keep getting a 36mb file which is not what l want.

I have checked the glb file by converting it to a .gltf with a bin file and texture separated and realised that there is a huge 19mb .png texture that’s created on export; I don’t know why that’s so, but this was never the case before.

These are the links for exploring the solution but l haven’t landed on any resolve.

Please assist me guys. Thanks in advance

Please don’t tag everyone in posts — unless it’s a question about a specific person’s work, better to just post without tagging.

The size of textures will change when loading and re-exporting from three.js, because they are de-compressed and then re-compressed. To build an editor, it would be important to keep original copies of the textures — not just THREE.Texture references. If you don’t care as much about compression artifacts and just want smaller files, you could make an edited version of GLTFExporter than always uses JPEG instead of PNG. Or alternatively, re-compress the file with an optimizing tool after export. For example:

npm install --global @gltf-transform/cli

gltf-transform oxipng input.glb output.glb --verbose

Okay, thank you for the insights, let me see a way to just use JPEG texture. I think that’s a possible solution.

Will work on the posting issue as well

Sorry, but do l make a gltf exporter that always uses jpeg instead of png

Changing the mimeType argument here to image/jpeg would probably be enough:

This worked and the filesize is down, but information such as transparency is not present, is there a way to check this because if I’m not mistake jpeg doesn’t carry this information?

That is correct that JPEG will not include transparency information. I think you’ll need to read through the GLTFExporter code more to choose the right cases for your models, for example look where processTexture is called — it knows there which type of texture slot is being written.

Tried it, my approach was to initialize a flag which checks whether or not a texture contains transparency information and then if it does then the mimeType of that particular instance or object3d wll be set to “image/png”.

It did not work since all texture were still being exported to .jpeg files or png files only. It seems that the mimeType check is done only once and then once set, its applied to the entire scene/ tree of objects.

Any ideas on how to customise the code to get conditional .png and .jpeg textures?

If you would like to share your code, we might be able to guess where things are going wrong.

Alright, let me make a codesandbox soon for this.