Как разместить на сайте высокодетализированную модель?
Пример высокодетализированной 3D модели (более 22 млн. полигонов)
Рассмотрим способы ускорения показа высокополигональных 3D моделей в браузере, и каких результатов при этом можно добиться.
Проблема показа детализированных 3D моделей
При размещении на сайте 3D модели часто требуется, чтобы она была приближена к реальным объектам, или же просто стоит задача показа именно нужной степени детализации. В этом случае мы сталкиваемся с проблемой демонстрации «тяжелых» моделей (в данной статье это модели, у которых свыше 1 млн. полигонов), особенно на слабых устройствам (часто это мобильные телефоны и планшеты в среднем и бюджетном сегментах).
Оптимизация просмотра 3D моделей
Для решения задачи демонстрации высокодетализированных моделей применяют различные алгоритмы, например:
Батчинг (Batching)
Запекание освещения (Baking)
Отсечение (Occlusion Culling)
Скрытие элементов, которые занимают слишком мало места на экране
Упрощение модели во время вращения и масштабирования (например, показ только каркаса)
Рассмотрим эффективность применения подобных методов оптимизации на примере сервиса Site3D Configurator, созданного на основе библиотеки three.js. Сравним алгоритмы данной платформы с онлайн средством просмотра gltf-viewer.donmccurdy.com. Далее приведем наиболее показательные результаты сравнения.
Замеры производились на ноутбуке в среднем ценовом сегменте со стандартной встроенной видеокартой (CPU i7–11370H, 16 Gb RAM LPDDR4x, Intel Iris X Graphics).
Как видим, оптимизация дает примерно в 2 раза лучший показатель FPS (число отрисовок сцены в секунду) по сравнению со стандартным сервисом просмотра.
Еще мы наблюдаем у тестируемой платформы намного более низкие значения FPS при отключении алгоритмов оптимизации по сравнению с обычным средством просмотра. Вероятно, это связано с более реалистичной графикой внутри Site3D Configurator (например, детализированные тени).
Также мы видим рост эффективности алгоритмов для моделей с большим количеством элементов, в том числе и одинаковых.
Заключение
Исходя из данного эксперимента можно сделать вывод, что благодаря современным сервисам просмотра 3D моделей, таких как Site3D Configurator, демонстрация достаточно высоконагруженных моделей доступна уже сейчас для массового использования.