Жизненный цикл веб-приложений XR

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

Большинство приложений, использующих WebXR, следуют похожей общей структуре:

1. Проверьте, поддерживает ли устройство пользователя и его браузер предоставление желаемого XR-опыта.

   1. Убедитесь, что API WebXR доступен; если navigator.xr не определен, можно предположить, что браузер и/или устройство пользователя не поддерживают WebXR. Если поддержка отсутствует, отключите все элементы пользовательского интерфейса, используемые для активации XR-функций, и прервите любые попытки перехода в XR-режим.
   2. Вызовите navigator.xr.isSessionSupported(), указав желаемый режим WebXR-опыта: inline, immersive-vr, или immersive-ar, чтобы определить, доступна ли необходимая сессия.
   3. Если необходимый тип сессии доступен, предоставьте пользователю соответствующий интерфейс для активации.

2. Когда пользователь запрашивает активацию функции WebXR, взаимодействуя с активированным выше пользовательским интерфейсом, запросите XRSession с желаемым режимом. Это выполняется путём вызова navigator.xr.requestSession(), снова указав строку, обозначающую необходимый режим: inline, immersive-vr, или immersive-ar.

3. Если обещание, возвращённое requestSession(), выполняется успешно, используйте новую XRSession для управления сессией WebXR в течение всего времени работы с WebXR. Это будет включать управление вводами, анимацией и рендерингом.

   1. Вызовите метод XRSession requestAnimationFrame() для планирования первого рендера кадра для XR-устройства.
   2. Если сцена сложная, рекомендуется создать Worker (или использовать уже созданный для этой цели) для выполнения вычислений, необходимых для рендера каждого кадра. Это снизит вероятность заметной задержки процесса рендеринга приложения.
   3. Каждый requestAnimationFrame() обратный вызов должен использовать предоставленную информацию о расположении объектов в 3D-мире для рендеринга кадра с помощью WebGL.
   4. Каждый раз при вызове обратного вызова необходимо снова вызвать requestAnimationFrame(), чтобы сообщить браузеру о необходимости повторного выполнения обратного вызова при наступлении времени рендеринга следующего кадра.

4. Когда это необходимо (например, при выходе пользователя из приложения или переходе на другой сайт), завершите XR-сессию; в противном случае продолжайте цикл, пока пользователь не выберет выход из XR-режима.

   1. Для завершения XR-сессии вручную вызовите XRSession.end().
   2. Включите обработчик события XRSession end, чтобы получать уведомления о завершении сессии, независимо от того, было ли инициировано завершение кодом, пользователем или браузером.