Add GLTF progressive example page

[marwie]

Description

Hi, I've created an example for progressive GLTF mesh & textue LOD loading. It uses the @needle-tools/gltf-progressive library (npm).

You can check the live page here:
https://three.needle.tools/examples/?q=progressive#webgl_loader_gltf_progressive_lod

Please let me know if this is OK or if there's that needs to be changed.

[Mugen87]

There is some z-fighting going on inside the moving house. Looking at below screenshot, the problematic area is left to the lamp on the ground.

[Mugen87]

There is quite a lot of description text in the example. Would it be possible to move the second and third line as a comment into the source code? The fourth and fifth lines can be combined into one.

[marwie]

There is some z-fighting going on inside the moving house. Looking at below screenshot, the problematic area is left to the lamp on the ground.

Oh good catch. This seems to be caused by Draco when using Quantize: Mesh (here's a link to the compressed mesh without progressive loading) - while Quantize Scene works fine.

[marwie]

There is quite a lot of description text in the example. Would it be possible to move the second and third line as a comment into the source code? The fourth and fifth lines can be combined into one.

I think some explanation is necessary on the website directly to understand what's happening on screen and what the library does, if that's hidden in the code I'd be afrait not many people would see that.

I tried to move the info in one line now - is that better? https://three.needle.tools/examples/?q=prog#webgl_loader_gltf_progressive_lod

The z-fighting is fixed too

[Mugen87]

I still looks pretty crowded when opening the example with a mobile device.

[Mugen87]

Apart from #31625 (comment), the PR looks good to me. If you have issues with generating the E2E screenshot, I can have a go after the merge.

[marwie]

Apart from #31625 (comment), the PR looks good to me. If you have issues with generating the E2E screenshot, I can have a go after the merge.

Thanks! That's great

[kristiker]

There's no progress bar, so I don't know when it has finished loading.

Edit: I would also recommend a toggle to reload the asset with the built-in loader.

[Mugen87]

Let's keep the example as simple as possible 😉 .

[marwie]

Let's keep the example as simple as possible 😉 .

Maybe we could add a button to reload the example with URLs to the same assets without progressive optimization to show the difference. What do you think about that?

[arpu]

what Licence is @needle-tools/gltf-progressive?

[wass08]

Is GLTF progressive LOD a blackbox? It looks impressive but to generate and host a compatible glb file it seems we need to pass through cloud.needle.tools?
The package library https://www.npmjs.com/package/@needle-tools/gltf-progressive doesn't come with the source code, it redirects to https://github.com/needle-tools/needle-engine-support.
Does it mean it's 100% tied to Needle is there a way to generate progressive GLBs with another solution?

[marwie]

Hi @wass08

Currently files can be generated via Needle Cloud or via our integrations for Unity or Blender (in which case processing runs locally).

We're looking into open sourcing more parts of that and providing documentation of the file format - If you want I can ping you again once that happened?

[wass08]

Hi @marwie thanks for your reply! Great that there's a way through Blender. It's generating it to be downloaded/deployed outside of your cloud or it's a requirement to be on that?

Yes please, ping me about updates on that 🙏

[marwie]

Hello @wass08 the files can be hosted on any webserver, there's no such requirement for them to be hosted on Needle infrastructure.