Почему браузерные игры лагают (и как это исправить)

Клик мыши долетает до нативной игры за считанные миллисекунды. В браузерной игре тот же клик стоит в очереди за ОС, JavaScript-движком и композитором, прежде чем стать пикселем. Разбираем, где браузеры добавляют задержку, как измерить вашу долю — и какие исправления действительно двигают цифру.

Цепочка ввода: от кнопки до пикселя

Каждый ваш клик путешествует по конвейеру. Каждый этап добавляет свою задержку, а браузер сидит посередине:

Сложите всё — и браузерная игра на 60-герцовом сетапе легко сидит на 40–60 мс задержки от клика до фотона ещё до того, как игровая логика вообще что-то сделала. Нативная игра с raw input просто пропускает несколько этих этапов. Этот разрыв — именно то, почему одна и та же мышь чувствуется чёткой на рабочем столе и ватной в браузерной вкладке.

Налог дисплея: 16,7 мс до того, как вы хоть что-то увидите

Факт, которым стоит делиться на LAN-пати: при 60 Гц один только дисплей способен добавить до 16,7 мс задержки — целый кадр — прежде чем ваш клик станет видимым. Этот единственный этап стоит больше, чем весь конвейер игровой мыши: хороший оптический переключатель срабатывает примерно за 1 мс, и опрос на 1000 Гц добавляет ещё 1 мс.

Люди с радостью тратят 150 долларов, чтобы сбрить 2 мс с мыши, оставляя 16,7 мс лежать на столе в настройках монитора. Перейдите на 144 Гц — и кадровый налог падает до 6,9 мс; на 240 Гц это 4,2 мс. Если ваш монитор способен, но настроен неправильно — удручающе частая ситуация — наш гайд о проверке реальной частоты обновления займёт две минуты.

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

Измеряем долю задержки, принадлежащую браузеру

Нельзя починить то, что нельзя изолировать. Наш тест задержки ввода в браузере измеряет именно тот сегмент, за который отвечает браузер: он сравнивает временную метку каждого события ввода с высокоточными часами момента, когда обработчик события реально выполняется, и выдаёт медиану и 95-й перцентиль по пачке кликов, тапов или нажатий клавиш.

Читайте результаты так: медиана — ваша типичная задержка диспетчеризации; на здоровом десктопном браузере это обычно единицы миллисекунд. p95 — это хвост: насколько плохо становится, когда главный поток спотыкается. Медиана 2 мс при p95 в 30 мс означает, что браузер в среднем в порядке, но регулярно замирает — и в игре это ощущается как случайные «съеденные» нажатия.

Будьте честны насчёт того, что измеряется: задержка диспетчеризации на границе событий браузера. Сюда не входят ни кнопка вашей мыши, ни USB-транспорт, ни развёртка дисплея — раздел с описанием в самом инструменте говорит об этом прямо. Для полной картины от начала до конца пройдите чек-лист инпут-лага после того, как закончите здесь.

Почему одна и та же мышь в браузере чувствуется хуже

Нативные игры читают ввод близко к железу — через raw input API, получающие данные мыши с минимумом церемоний. Браузеры идут живописной дорогой. ОС передаёт событие браузеру, браузер решает, какой элемент находится под курсором (хит-тестинг всего DOM), отправляет его в JavaScript на главном потоке — и только тогда ваш игровой код может отреагировать. Если главный поток занят выполнением рекламного скрипта, ваш клик ждёт в очереди.

Три специфически браузерных усилителя:

• Занятый главный поток: тяжёлые вкладки, видеореклама и криптоподобные скрипты страниц делят тот поток, на котором работает ваша игра. Одна фоновая вкладка, играющая видео без звука, способна добавить заметный джиттер каждому нажатию.
• Расширения: каждое расширение, слушающее события страницы, добавляет работы диспетчеру. Проверялки грамматики и купонные инжекторы — рецидивисты.
• Объединение событий: браузеры пакетуют высокочастотные события движения указателя и доставляют их группами. На бумаге отлично для плавности; на деле данные вашего аиминга приходят комками.

Этим же объясняется, почему ввод с клавиатуры может ощущаться губчатым в браузере, хотя та же клава мгновенна в нативном приложении — паттерн, который мы разбираем в «лагает ли моя клавиатура» и более глубоком разборе задержки клавиатуры.

Исправления, которые реально работают

Примерно в порядке эффекта:

• Включите аппаратное ускорение. В Chrome/Edge: Настройки → Система → «Использовать аппаратное ускорение». Перенос композитинга на GPU стоит несколько миллисекунд и убивает большинство странностей с ритмом кадров. Оно должно быть включено по умолчанию; обычные причины, почему нет, — корпоративные политики и старые блокировки драйверов.
• Выставьте монитору его реальную частоту обновления. Половина жалоб на «лагающий браузер», которые мы видим, — это 144-герцовые панели, застрявшие на 60 Гц. Проверяйте реально выводимые кадры, а не только настройку в Windows.
• Закройте фоновые вкладки и отключите расширения. Особенно всё, что играет медиа или внедряет скрипты в страницы. Проверьте на чистом профиле браузера — если p95 обвалился, какое-то расширение ело ваши нажатия.
• Играйте в полноэкранном режиме. Полноэкранные окна получают более прямой путь композитинга в большинстве браузеров — минус несколько миллисекунд и минус накладные расходы оконного менеджера рабочего стола.
• Предпочитайте проводную периферию Bluetooth. Bluetooth добавляет примерно 10–20 мс плюс периодические ступоры на ретрансляциях поверх всего остального. Донглы 2,4 ГГц и обычный USB драматически плотнее.
• Используйте pointer lock там, где игра его предлагает. Pointer lock даёт браузерным играм почти сырые дельты мыши, минуя хит-тестинг курсора для движения.

Применяйте по одному и перезапускайте тест задержки после каждого изменения. Видеть, как ваш собственный p95 падает с 25 мс до 6 мс, убедительнее любого гайда по настройкам.

Vsync и ритм кадров, одним абзацем

Рендер в браузере синхронизирован с vsync: кадры выводятся в такт с обновлением вашего дисплея. Это хорошо — нет разрывов, — но это значит, что ваша игра может обновляться только на границах кадров, а любой кадр, пропустивший дедлайн, ждёт целый лишний кадр. При 60 Гц один пропущенный дедлайн стоит 16,7 мс; при 240 Гц тот же промах стоит 4,2 мс. Неровный ритм кадров — причина, по которой браузерная игра может показывать «60 FPS» и всё равно дёргаться: кадры все на месте, просто они приходят в неровное время. Высокая частота обновления — самое дешёвое лекарство, потому что она уменьшает цену каждой возможной ошибки.

Когда дело не в браузере

Если вы сделали всё вышеперечисленное, а игры всё равно ощущаются странно, узкое место — в другом месте цепочки. Обычные небраузерные подозреваемые: телевизор вместо монитора (выключенный игровой режим добавляет 30–80 мс), Bluetooth-клавиатура или мышь, монитор, всё ещё сидящий на 60 Гц, тяжёлая нагрузка на систему от другого приложения или — в онлайн-играх — обычная сетевая задержка, которая просто носит тот же костюм. Пинг в 20 мс — это не инпут-лаг, но ваши руки не отличат разницы; наша статья про среднюю скорость реакции объясняет, почему 20 мс — прямо на грани человеческого восприятия.

Пройдите всю систему методично по чек-листу инпут-лага: измерьте каждый этап, измените одну вещь, измерьте снова. Охота на задержку расстраивает только тогда, когда вы гадаете.

Итог

Браузерные игры лагают потому, что браузерный клик путешествует дальше нативного — через хит-тестинг, главный поток JavaScript, синхронизированный с vsync композитор и, наконец, дисплей. Самые крупные выигрыши скучны и бесплатны: аппаратное ускорение включено, частота обновления выставлена правильно, фоновые вкладки и расширения убиты, полноэкранный режим включён, Bluetooth выключен. Измерьте задержку диспетчеризации вашего браузера, почините этапы, которые контролируете, — и только потом вините игру. Большинство «лагающих браузерных игр» на самом деле — лагающие браузерные сетапы.