Обновления для веб-версии находятся здесь: Поднимите свой браузер на новый уровень

BEN CRAVEN, MATTHEW BUSCEMI, ANTHONY BOWKER / UNITY TECHNOLOGIESContributor
Nov 30, 2023|15 Мин
Обновления для веб-версии находятся здесь: Поднимите свой браузер на новый уровень
Эта веб-страница была переведена с помощью машинного перевода для вашего удобства. Мы не можем гарантировать точность или надежность переведенного контента. Если у вас есть вопросы о точности переведенного контента, обращайтесь к официальной английской версии веб-страницы.

На выставке Unite 2023 мы представили наши новейшие предложения в области веб-программ. Среди них - подробная информация о долгожданной поддержке мобильных браузеров, ранний взгляд на возможности WebGPU для улучшенной графики и рендеринга в настольных браузерах, а также захватывающее объявление наших партнеров из Meta о переносе игр Unity на платформу Instant Games в Facebook и Messenger. Читайте дальше, чтобы узнать, что ждет вас в следующем веб-проекте.

Начало работы: Игры в Интернете

Unity имеет долгую историю работы с веб-режимом. В 2006 году веб-плеер Unity дебютировал в качестве плагина для веб-браузеров. С появлением HTML5 браузеры стали отказываться от поддержки плагинов, а веб-плеер Unity был устаревшим в 2015 году. Далее мы перешли на WebGL, чтобы запускать игры прямо в браузере с помощью asm.js. Unity была в самом начале процесса разработки WebAssembly (WASM), и с тех пор мы развиваемся вместе с WASM. Благодаря этому Unity Engine работает практически в естественных условиях в Интернете. В версии 2018.2 наше решение WebAssembly заменило файл asm.js, используемый по умолчанию.

Вы давно не слышали о нас, но мы считаем, что сейчас наступил переломный момент для контента Unity в Интернете.

Помимо технических достижений, мы обновили схему наименования платформы. WebGL теперь называется Unity Web, чтобы отделить технологию WebGL от веб-платформы Unity. Мы также хотим подготовиться к будущему с несколькими стандартами визуализации. В конечном итоге вы сможете создать сборку с использованием WebGL, сборку с WebGPU или одну сборку с обоими вариантами.

Преимущества игровых веб-платформ

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

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

Рассмотрение контента для Интернета

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

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

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

НАСА и Артемида I

Artemis Real-time Orbit Website (AROW) - это интерактивный трекер реального времени для миссии Artemis I, запущенный в ноябре прошлого года и созданный с помощью Unity.

В мифологии Артемида - сестра-близнец Аполлона, поэтому НАСА назвало серию миссий, знаменующих возвращение на поверхность Луны, в честь этой греческой фигуры.

Любители космоса по всему миру могли следить за тем, где находится капсула "Орион" на орбите, а также видеть место ее падения в Тихом океане - и все это через браузеры своих настольных компьютеров. НАСА планирует использовать этот инструмент для всех будущих миссий Artemis и расширить его, чтобы отслеживать не только капсулу Orion, но и все компоненты миссии.

AROW была создана стажером Сетом Ламбертом, который с тех пор стал постоянным членом команды НАСА по связям с общественностью.

Поддержка мобильных браузеров в Unity 6

На конференции Unite мы с гордостью сообщили, что в Unity 6 появится поддержка браузеров для Android и iOS. Скоро вы сможете запускать свои игры Unity в любом месте в Интернете, в том числе в браузерах для iOS или Android. Вы также сможете встраивать свои игры в веб-представление в нативном приложении или использовать наш прогрессивный шаблон веб-приложения, чтобы ваша игра вела себя как нативное приложение, с собственным ярлыком и автономной функциональностью. Мы уверены, что если вы нацелились на Unity Web на мобильных устройствах, то, скорее всего, вам удалось добиться успеха на высококлассных мобильных устройствах, выпущенных в последние два-три года, но результаты могут варьироваться в зависимости от вашего контента. К моменту выхода Unity 6 у нас будет более четкое руководство по минимальным аппаратным требованиям для Unity Web на мобильных устройствах.

Здесь вы можете увидеть наш недавний образец 2D-проекта Счастливый урожай запущенный в Safari на iPhone 15 Pro.

Образец проекта Unity 2D Happy Harvest работает в мобильном веб-браузере Safari на Apple iPhone 15 Pro.
Идеальное время

Safari начал поддерживать WebGL2, что позволяет Unity Web работать как на iOS, так и на Android-устройствах. Мы наблюдаем постоянный рост скорости и надежности мобильных сетей, а также постоянно увеличивающуюся мощность CPU и GPU. Поскольку современная аудитория жаждет мгновенных впечатлений с минимальным трением, мы считаем, что игроки сейчас готовы к интерактивному контенту короткой формы.

Стратегическое партнерство Unity x Meta для мгновенных игр

Как было объявлено на презентации Unite Keynote, Unity сотрудничает с Meta для создания поддержки платформы Instant Games. Открыв эту экосистему для создателей, игроки смогут мгновенно находить и играть в игры на Facebook и в беседах Messenger. Аудитория геймеров исчисляется сотнями миллионов, и это фантастическая возможность для вас расширить охват вашего контента для совершенно новой когорты.

"Тесное сотрудничество Meta и Unity уже принесло многообещающие результаты в плане повышения производительности HTML5-игр, созданных с использованием Unity, - отметил Эндрю Мо, руководитель направления Facebook Gaming в Meta. "Мы с нетерпением ждем продолжения этой динамики в наступающем году и надеемся, что разработчикам игр станет проще выводить свой контент на Facebook и Messenger".

Он добавил: "Мы считаем, что у игр есть большой потенциал в том, чтобы сделать их мгновенно доступными, особенно если они предназначены для игры с вашими друзьями и сообществом. Мы рады сотрудничать с Unity, чтобы раскрыть этот потенциал на нашей платформе".

"Мы рады сотрудничать с Unity, чтобы раскрыть этот потенциал на нашей платформе". - Эндрю Мо, руководитель отдела продуктов для Facebook Gaming, Meta

Команда веб-платформы Unity работает над созданием партнерства, включая специальную цель сборки, чтобы вы могли тестировать, оптимизировать и публиковать игры в упорядоченном потоке, предназначенном для Instant Games. Будет создан C# SDK для взаимодействия с API Instant Game, а также множество новых чистых оптимизаций, чтобы игроки могли начать игру за считанные секунды.

Мы также сотрудничаем с игровыми студиями для проверки этого нового инструментария. Среди партнеров по запуску - компания Coatsink, у которой есть несколько игр на платформах Meta, включая Ready, Set, Cook! Вскоре после того, как Coatsink подписала контракт с партнером по запуску, команда Unity применила некоторые ранние оптимизации к этой игре, и результаты оказались весьма многообещающими.

Изображение ключа к книге "Готовь, готовь, готовь!" автора Коатсинк

При снижении времени загрузки всего на 25 % количество активных сессий выросло на 50 %, а количество переходов по клику - с 35 % до 58 %. Это означает, что в самом начале работы над оптимизацией Ready, Set, Cook! большинство игроков никогда не видели геймплея, а большинство - только в компании друзей. Это лишь вершина айсберга нашей оптимизации, но вы можете видеть, как относительно небольшое сокращение времени загрузки может привести к огромной разнице в вовлеченности.

На этом графике показано сравнение между оригинальной сборкой, предоставленной Coatsink, и оптимизированной версией с применением наших новейших инструментов Instant Games-ready. Как видите, мы уже сократили время интерактивности игры Ready, Set, Cook! более чем на 50 %. Данный тест проводился на Pixel 5 с дросселированием до 48 Мбит/с.

Гистограмма, отображающая разницу во времени загрузки - в секундах - между оригинальной и оптимизированной версиями Ready, Set, Cook! Для 48 Мбит/с (от 12 до 5,5), 86 Мбит/с (от 8,2 до 3,7) и 176 Мбит/с (от 6,1 до 3,6)

На графике выше вы можете видеть, каким было время загрузки до оптимизации и каким оно является сейчас, когда мы используем название Ready, Set, Cook! в качестве тестового. Во-первых, дросселирование до 48 Мбит/с - это средняя скорость мобильной сети в мире по данным Ookla, даже не 5G. При среднемировой скорости широкополосного доступа 86 Мбит/с мы еще быстрее. На надежном 5G-соединении со скоростью 176 Мбит/с мы увидели еще более высокую скорость, но при этом столкнулись со снижением отдачи, поскольку пропускная способность сети перестала быть основным ограничивающим фактором.

Как добиться молниеносной скорости

Чтобы добиться быстрого времени загрузки, необходимо рассмотреть все аспекты загрузки и инициализации вашей игры в веб-браузере.

Анатомия веб-сборки

Веб-сборка состоит из нескольких файлов:

  • Файл WebAssembly (.wasm): Это двоичный исполняемый файл, включающий движок Unity и логику вашей игры.
  • Большой файл ресурсов (.data): Сюда входят глобальные метаданные и ресурсы активов для сцен, включенных в сборку.
  • Могут быть пакеты активов или Addressables.
  • Ваш WebGL-шаблон (HTML и CSS), а также несколько файлов Unity Framework JavaScript, чтобы все заработало.
Лучшие практики разработки мобильных веб-сайтов

Прежде всего, для создания хорошей сборки релиза необходимо следовать некоторым передовым практикам, в том числе:

  • Указание компилятору и компоновщику собирать код оптимального размера
  • Использование сжатия Brotli
  • Добавьте HTTP-теги предварительной загрузки в ваш веб-шаблон, чтобы заранее загрузить все пакеты активов и Addressables, необходимые для первой сцены.

Мы сделаем их по умолчанию в грядущей целевой сборке Instant Games.

Также подумайте о том, как сократить время загрузки, воспринимаемое игроками, отобразив заставку или анимацию во время загрузки и инициализации движка Unity.

Сокращение файлов ресурсов

В зависимости от вашей игры, активы могут быть больше или меньше, чем WebAssembly.

Для начала рассмотрим несколько лучших практик. Поскольку время загрузки первой сцены имеет решающее значение, рассмотрите возможность использования системы Unity Addressables, чтобы разбить каждый актив на отдельные загрузки. Затем добавьте теги HTTP preload для предварительной загрузки Addressables, которые необходимы для первой сцены. Последующие сцены будут загружать активы по требованию из системы Addressables.

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

Во-вторых, давайте посмотрим на используемые графические настройки. Выбор сжатых текстур ETC Crunch обеспечивает наименьший размер загружаемых файлов и низкое использование памяти GPU на мобильных устройствах. Если вы используете сжатые текстуры ASTC, внимательно смотрите на размер блока, выбирая больший размер блока для текстур меньшего размера. Аналогичным образом настройте отсечение шейдеров в настройках проигрывателя для вашего проекта.

WebAssembly нового поколения

Технология WebAssembly не стоит на месте, и мы приносим обновления в Unity. Мы невероятно благодарны сообществам Web W3C за работу по поддержке этих передовых технологий. Веб-игры невозможны без инвестиций и поддержки со стороны всех разработчиков браузеров. Мы особенно ценим наше сотрудничество с командой Chrome в Google. Вместе мы работали над улучшением игровых приложений для WebAssembly и повышением производительности графики в сложных игровых нагрузках.

Компилятор Emscripten переносит вашу сборку Unity il2cpp в WebAssembly. С каждым новым выпуском Long Term Support (LTS) мы включаем последнюю версию Emscripten, что позволяет ускорить сборки для разработки и уменьшить количество оптимизированных сборок для выпуска (на сборку которых может уйти немало времени).

В Unity 6 вы сможете включить поддержку памяти объемом 4 ГБ. Это позволяет создавать более крупные 3D-изображения в реальном времени в Интернете, используя большую память, доступную для браузеров настольных компьютеров. В будущем это откроет путь к поддержке 64-битной памяти, как только все браузеры выпустят ее.

В настоящее время, когда вы включаете поддержку исключений в веб-сборках, возникают некоторые накладные расходы, например, когда во все функции добавляется код для поддержки try/catch. Благодаря встроенной обработке исключений WebAssembly, которая будет доступна в качестве опции в Unity 6, исключения будут доступны с небольшими накладными расходами.

Также в Unity 6 можно включить поддержку WebAssembly SIMD. Это ускоряет математические вычисления процессора с помощью векторизованных инструкций. Он работает на устройствах x64 и ARM, отображая SIMD-инструкции WebAssembly на SSE или Arm NEON при загрузке веб-страницы. Улучшения здесь зависят от устройства и браузера, но они заметны.

Эти функции являются необязательными и доступны только в новых версиях веб-браузеров.

От WebGL к WebGPU

Появление нового бэкенда WebGPU - это значительная веха в ускорении веб-графики, открывающая путь к беспрецедентному скачку в точности рендеринга графики в веб-играх Unity.

WebGPU разработан с целью использования и раскрытия современных возможностей GPU в Интернете. Этот новый веб-интерфейс обеспечивает современный интерфейс ускорения графики, который реализуется через встроенные API GPU, такие как DirectX 12, Vulkan или Metal, в зависимости от используемого вами настольного устройства.

WebGPU откроет поддержку новых и захватывающих функций рендеринга, обеспечивая уровень графической достоверности, ранее невиданный в настольном вебе. Как и в других современных графических API, контроль нижнего уровня над настройками рендеринга и выполнением GPU открывает новые возможности оптимизации, что может привести к снижению нагрузок на CPU и GPU и повышению пропускной способности и задержки.

WebGPU также впервые переносит вычислительные шейдеры в веб. GPU Compute Skinning радикально повышает производительность рендеринга персонажей с сеткой скинов. Теперь все преобразования вершин перекладываются на GPU. Демонстрация выше использует преимущества GPU Skinning для создания сетки из кожи этих роботов и скелета под ней, сохраняя при этом относительно высокую частоту кадров. Если бы это было сделано на процессоре, то FPS был бы однозначным.

Демонстрация интерактивного вычисления скинов персонажа Адама в WebGPU

Другой пример - VFX Graph от Unity, который процедурно генерирует геометрию непосредственно в вычислительных шейдерах. В представленной ниже симуляции частиц анимируется чуть более полумиллиона частиц, и все они перемещаются с помощью вычислительных шейдеров на GPU.

Интерактивная демонстрация графики VFX с использованием логотипа Google Chrome, иконки куба Unity и логотипа WebGPU.

Возможно, вы уже видели вышеупомянутую демонстрацию Boat Attack . Теперь вы видите, что он полностью работает на WebGPU. Сегодня WebGPU включен в Google Chrome и Microsoft Edge на macOS и Windows. В последнем примере мы показываем интерактивную атаку на лодку, созданную на WebGPU.

Скриншот демонстрационной версии WebGPU Boat Attack

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

Графический бэкэнд WebGPU все еще находится в разработке, и мы не рекомендуем использовать его в производственных случаях. Однако уже сейчас она доступна в раннем доступе. Подробности о том, как начать работу, можно найти на графическом форуме.

Давайте рассмотрим

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

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

Поддержка мобильного веба появилась в Unity 6. Узнайте больше о Unity 6 из презентации Unite Keynote.

Если вы любите возиться, прочтите наше сообщение на форуме о WebGPU, который появится в Unity 6, чтобы получить информацию о раннем доступе к бэкенду WebGPU. Затем узнайте еще больше о последних разработках движка из доступных сейчас по запросу сессий Unite 2023, включая сессию Unite "Мгновенно донести вашу игру на Unity до большего числа игроков в Интернете" (вставка ниже).