Когда HUD вдруг встал на голову в браузере 🙃

7 ноября 2026 г.

В версии 2026.10.10 мы сделали два больших шага под капотом: игра теперь работает на Unity 6.6, а браузерная версия запускается на WebGPU, если браузер его поддерживает, например в актуальных Chrome и Edge. В остальных случаях она работает на WebGL 2, как раньше. Оба — способы, которыми сайт общается с видеокартой. WebGL существует уже много лет, WebGPU — его преемник, ближе к тому, как устроены современные видеокарты. Вскоре после этого мой HUD встал на голову. 🙃

Увидели один раз и больше никогда. Я открыл игру в Chrome на своём ноутбуке, и HUD был перевёрнут. Мы пытались воспроизвести это и не смогли. Сам я тоже больше этого не видел. Поэтому пока мы закрыли вопрос.

Потом он вернулся, на этот раз с фотодоказательством. 19 октября это случилось снова, в новом мире. На этот раз я сразу отправил отчёт об ошибке со скриншотом. Только сам скриншот оказался сломан: три копии рядом, сплошь в полосах. Вот детективная работа, которая за этим стоит: картинка состоит из пикселей, и у каждого пикселя обычно три значения — красный, зелёный и синий. Игра ожидала три значения на пиксель, а WebGPU выдавал четыре: ещё одно значение для прозрачности. Читаем те же данные по четыре значения на пиксель, и картинка становится читаемой. Мир стоит ровно, но весь HUD отражён: панель быстрого доступа прилипла к верху, а вопрос VEGA «Хочешь, покажу тебе основы?» перевёрнут. Заодно выяснилось, что все скриншоты из браузера были сломаны с момента перехода на WebGPU. Никто не замечал, потому что раньше ни один отчёт из браузера не приходил со скриншотом. 🔍

Почему только HUD? Начиная с уровня графики «Средне», при включённом эффекте визора, отдельная камера рисует HUD в собственную картинку в графической памяти. Специалисты называют это render texture. Затем игра накладывает эту картинку на мир вместе с эффектом визора и его свечением. Тонкость в том, что графические системы не согласны, где в такой картинке «верх». Одни считают строки сверху, другие снизу. Обычно игровой движок это выравнивает. В браузере на WebGPU для картинки HUD это иногда не срабатывало. Почему именно иногда, мы до сих пор точно не знаем.

Воспроизвести? Не получилось. Чтобы самим находить ошибки браузера, мы построили небольшой испытательный стенд. Мы скачиваем готовый игровой пакет версии и запускаем его на своём компьютере. Затем браузер с дистанционным управлением и WebGPU проходит по меню, запускает мир и делает скриншоты, на которые смотрит наш ИИ. Мы попробовали так три раза, с точно такой же ссылкой, как у меня, и на том же графическом чипе, и все три раза HUD стоял правильно. Ошибка была только в моём настоящем Chrome.

Если ошибку не вызвать, её нужно обнаружить. Теперь камера HUD рисует крошечную пурпурную точку размером в четыре пикселя в левом верхнем углу своей картинки. Прежде чем накладывать HUD на мир, шейдер визора смотрит в оба левых угла, где оказалась точка. (Шейдер — это небольшая программа, которая выполняется прямо на видеокарте.) Если точка внизу, шейдер переворачивает HUD. При этом он маскирует углы, так что точку вы никогда не видите. Но пока ошибка прячется, такой ремонт трудно проверить. Поэтому есть тестовый переключатель, который специально ставит точку не в тот угол. Тогда HUD обязан встать на голову, и именно так и вышло, в точности как на моём скриншоте. Это доказало, что обнаружение работает. ✅

Очевидное решение стало бы ошибкой. «Тогда просто всегда переворачивай на WebGPU!» Мы попробовали это на испытательном стенде, прежде чем встраивать. Это сломало бы HUD у всех, потому что в большинстве случаев он стоял правильно.

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

Что вам с этого. С версии 2026.10.24 HUD в браузере стоит правильно, а скриншоты из браузера снова настоящие картинки. Отчёты об ошибках теперь содержат и раздел о графике, где среди прочего указано, как был ориентирован HUD. Так что в следующий раз мы узнаем об этом даже без картинки. В этом же пакете мы исправили ещё одну ошибку из отчётов Lyxette: животное больше не парит над выкопанной вами канавой. 🐾

Если вы когда-нибудь всё же увидите HUD вверх ногами: в браузере F2 открывает отчёт об ошибке. Мы посмотрим. 🙏