Баннер производительности WebGL в Safari.

Safari — особенно на iOS — всегда считался вершиной вызовов производительности для разработчиков, работающих над 3D вебом. Реализация WebGL на базе Metal, вместе с уникальными характеристиками производительности WebKit, делает его особенно интересным для работы.

В этой статье мы даем некоторые инсайты о том, как можно улучшить производительность ваших WebGL приложений в Safari.

Apple Vision Pro 

В недавние дни с запуском Apple Vision Pro производительность WebGL в Safari приобрела еще большее значение, так как версия Safari для Apple Vision унаследовала все характеристики производительности Safari на MacOS и iOS.

Мы скоро опубликуем полную статью о WebXR с Apple Vision Pro, подпишитесь на нашу рассылку, чтобы получить уведомление.

Wonderland Engine на Apple Vision Pro 

Если вы уже используете Wonderland Engine, у нас хорошие новости: все оптимизации, которые мы сделали для нашего релиза 0.9.0 переносятся на Apple Vision Pro.

Разработчики, имеющие доступ к Apple Vision Pro, сообщают о отличной производительности своих приложений на основе Wonderland Engine:

Оптимизация для Safari 

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

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

Узкие места 

Вот несколько характерных проблем, с которыми вы можете столкнуться, работая с WebGL в Safari:

Буферы униформ 

Из-за того, как API графики Apple Metal отличается от WebGL, в Safari требуется эмулировать униформ буфер в стиле WebGL под капотом. Эта эмуляция вызывает некоторые трудности в прогнозировании производительности UBO: некоторое использование будет проходить нормально, тогда как другое может вызывать задержку в 150мс при попытке загрузить данные не в тот момент времени.

Этот фрагмент кода из реализации Metal в Angle (которая используется WebKit для реализации API WebGL2) указывает на реализацию GLES, эквивалентную WebGL bufferSubData. Он помогает оценить, какие усилия разработчики браузеров прилагают, чтобы обеспечить нам согласованный графический API. Он также показывает, до каких усилий доходит команда Wonderland Engine, чтобы вы поняли производительность браузера и оптимизировали её для вас.

Было много недовольства по поводу того, что Safari долго не выпускал поддержку WebGL2. Вопреки предположениям, что они никогда не поддержат его, они выпустили поддержку WebGL2 в сентябре 2021 года с Safari 15. Чтение кода WebKit и Angle вызывает некоторое сопереживание относительно того, почему это могло быть не такой легкой задачей.

Доступ к состоянию WebGL 

Функция WebGL getParameter приготовила для вас несколько сюрпризов с точки зрения производительности. То, что кажется безобидной функцией, может стоить многих ресурсов производительности.

Ошибка WebGL 

Хотя проверка ошибок с getError в общем случае хорошая идея, избегайте её вне вашего callback для кадра, так как это может быть дороже, чем должно.

Память и ограничения 

WebGL в Safari будет сообщать ограничения на размеры текстур, слоев, размеры буферов униформ и другое. Хорошим инструментом для проверки этих ограничений является webglreport.com.

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

Для более эффективного использования ресурсов памяти на iOS, Wonderland Engine предоставляет функцию, которую мы называем Texture Streaming, для динамической замены частей текстур в памяти и из нее в зависимости от того, что необходимо в текущем кадре. Она включена по умолчанию.

Заключительные слова 

Мы подготовим детальный блог пост о WebXR на Apple Vision Pro в ближайшее время. Подпишитесь на нашу рассылку, чтобы получить уведомление, когда мы ее выпустим.

До тех пор мы надеемся, что вы дадите шанс Wonderland Engine! Особенно если вы приходите из Unity, Wonderland Engine легко изучить.

Не забудьте присоединиться к нашему Discord серверу, поскольку мы с удовольствием укажем вам на нужные ресурсы, чтобы начать.

Last Update: February 9, 2024

Будьте в курсе.