Low-poly пальмы для three.js: GLB-модели

Пальмы в стиле Low-poly для three.js

Низкополигональные пальмы подключаются к сцене three.js почти без настройки: загрузите GLB через GLTFLoader из three/addons и передайте меши LOD0–LOD3 в THREE.LOD с помощью lod.addLevel(mesh, distance) — уровень детализации будет переключаться по расстоянию до камеры каждый кадр. Гранёный вид дают flat shading и вершинные цвета (COLOR_0), поэтому текстуры не нужны: один материал подойдёт всей сцене, а листья сделаны сплошной геометрией — без alpha-теста и лишнего overdraw на мобильных GPU.

В подборке пять пальм: Кокосовая пальма, Финиковая пальма, Канарская пальма, Вашингтония и Хамеропс. На LOD0 это от нескольких сотен до пары тысяч треугольников, точка вращения — у основания, а невидимый collision-меш можно передать в Rapier или cannon-es. Высаживайте пальмы вдоль берега через InstancedMesh или собирайте разные варианты через BatchedMesh и новый seed.

О стиле Low-poly

Low-poly — самый дешёвый стиль и в рендере, и в размере билда.

Плоское затенение: одна нормаль на грань даёт чёткие грани, карты нормалей не нужны.
Цвет хранится в вершинах (glTF COLOR_0): нет текстур, нет работы с UV, почти не тратится видеопамять.
Листва — сплошная геометрия, а не карточки с альфой: нет alpha-test и прозрачного overdraw, что важно для мобильных GPU.
Один материал можно использовать для всех моделей сцены, поэтому деревья легко батчатся и инстансятся.
Типичный бюджет LOD0 — от нескольких сотен до пары тысяч треугольников.

Подходит для мобильных игр, WebGL/WebGPU, VR, стратегий, градостроительных и стилизованных инди-игр. В движке используйте материал, который учитывает цвет вершин.

Как использовать в three.js

В three.js загружайте GLB через GLTFLoader из three/addons; DRACOLoader или KTX2Loader нужны, только если файл использует эти расширения.

LOD по расстоянию: THREE.LOD и lod.addLevel(mesh, distance) для LOD0–LOD3; уровни переключаются по дистанции до камеры каждый кадр.
Леса: InstancedMesh рисует тысячи копий за один draw call, а BatchedMesh позволяет смешивать несколько вариаций деревьев. THREE.LOD не работает на уровне отдельных инстансов, поэтому группируйте инстансы по LOD для каждого чанка сами.
Листва: alphaMode MASK из glTF превращается в material.alphaTest, а двусторонние материалы автоматически получают side: THREE.DoubleSide.
Меш коллизии: сделайте невидимым и передайте в физическую библиотеку, например Rapier или cannon-es.