Level of detail for textures?

Is there a recommended way to use Level-of-detail with textures? - for example when a user is close to an image texture, show a higher-resolution image version.

1 Like

As far as I know LOD works on meshes level. So basically you may just create a set of same meshes with different materials/textures which will be shown according to the distance from a camera.


that doesn’t take into account screen size - which is more important - I want to swap based on size in pixels as seen on screen.

You can by enabling your LODs based on screen coverage: look for useLODScreenCoverage in Levels of Detail (LOD) | Babylon.js Documentation


perfect. Are all LOD textures downloaded immediately or are they downloaded when needed?

Should be downloaded immediately to be ready when needed

Also, textures have actually kind of LOD system, but called mipmap.

If I’m not wrong, when using file format like jpg or png, mipmap are generated on the fly in the GPU.
A way to store precomputed mipmaps in your textures to gain some perf is to use .ktx format.