Введение в Разработку WebXR

AR и VR в Интернете — это удивительная технология. Она позволяет создавать и публиковать свои идеи без необходимости прохождения через курируемые магазины и при этом легко делиться ими, как веб-сайтом.

VR в Интернете существует с момента первого выпуска WebVR 1.0 в Chrome и Firefox в 2016 году. Этот эксперимент был заменен WebXR Device API, который в будущем будет поддерживать и дополненную реальность, а не только виртуальную (и доступен в Chrome для Android с ноября 2020 года). Теперь, когда эта новая технология достигла достаточно стабильного уровня, чтобы разработчики могли начать полагаться на нее, как начать?

Фреймворки 

Прочтите наш последний пост в блоге для получения рекомендаций о том, как выбрать фреймворк.

3 Специфические для Веба Проблемы 

Разработка XR для веба и нативная разработка различаются по трем крупным пунктам:

Время Загрузки 

Ожидание загрузки игры неприемлемо в Интернете. Каждая секунда ожидания увеличивает вероятность отказа пользователей.

Сохранение небольшого размера игровых активов, использование сжатия и обеспечение быстрой загрузки — ключевые моменты для сохранения довольства пользователей.

Производительность 

Веб запускается в изолированной среде браузера. Это обеспечивает защиту устройства, но добавляет накладные расходы на производительность, так как действия сайта должны быть перепроверены. Эти ограничения, наряду с особенностями JavaScript, делают VR и AR еще более сложными в плане производительности.

Масштабируемое Качество 

Если вы выпускаете нативное приложение в VR, вы обычно нацелены на конкретные устройства и можете адаптировать продукт под их характеристики.

Преимущество Интернета в том, что он универсально кросс-платформенный, и любое устройство может запускать ваше WebXR-приложение. Это значит, что вам нужно учитывать всё — от тостера до настольного ПК — и определить минимальные требования.

В VR диапазон устройств также предполагает разнообразие методов ввода: от простого управления взглядом (Google Cardboard) до контроллеров с 3 и 6 степенями свободы, управления жестами (Quest 2) и отслеживания взгляда (Quest Pro, Apple Vision Pro).

Вам предстоит определить наименьший общий знаменатель, который должен поддерживать ваше приложение.

Решения 

Важно учитывать эти специфические для веба проблемы уже на этапе дизайна: они влияют на ваш выбор художественного стиля, способа взаимодействия и могут стать ключевым фактором успеха вашего приложения.

Загружаться Быстрее 

В общем, чем меньше ваши файлы, тем быстрее загрузится игра. В Интернете рекомендуется загружать только те активы, которые необходимы для начальной загрузки, и лениво загружать остальное в процессе работы.

Текстовые форматы обычно требуют больше времени на разбор, поэтому рассмотрите использование двоичных форматов активов. Форматы изображений, такие как WebP и Basis Universal, могут улучшить размеры файлов на CPU и GPU по сравнению с традиционными PNG и JPEG изображениями.

Производительность 

Следите за производительностью и оптимизируйте в зависимости от ваших задач. Поддерживайте активы маленькими и используйте высокое разрешение для значимых объектов в зависимости от расстояния до пользователя.

Специальные расширения браузера, такие как OCULUS_multiview2 могут помочь с производительностью GPU. Другие, такие как предстоящий WEBGL_multi_draw, помогут с производительностью CPU.

Большинство фреймворков имеют руководства или советы по оптимизации производительности. Изучите их, чтобы понять, что вы можете сделать с самого начала, если работаете над крупным проектом.

Масштабирование 

Для улучшения масштабируемости вы можете загружать активы в зависимости от типа ввода гарнитуры или строки user agent. Системы, основанные на управлении взглядом, обычно менее мощные, чем устройства с 6 степенями свободы или те, которые поддерживают управление жестами.

Wonderland Engine 

Wonderland Engine стремится взять на себя задачи по оптимизации, чтобы вы могли сосредоточиться на функциях вашего приложения, не беспокоясь о технических затруднениях, связанных с его гладкой работой.

Wonderland Engine недавно достиг версии 1.0. Мы будем рады приветствовать вас в нашем сообществе Discord!