Как запустить «Шарарам» без лагов: энтузиаст перенёс игру с Flash на Ruffle

4 часа назад Прокомментировать Просмотры: 14

«Шарарам» — культовая, пускай и возрастная MMORPG во вселенной «Смешариков». Для огромной части моего поколения, появившегося на свет в двухтысячных, это место стало стартовой площадкой для поиска первых друзей и освоения базовых социальных навыков. Мне уже 23 года, но я регулярно — раз в месяц-полтора — захожу туда, чтобы пообщаться со сверстниками и поностальгировать по беззаботным временам.

Однако с возрастом простое желание «поностальгировать» трансформировалось в стремление поддержать родной проект. Отчасти это обусловлено глубинным беспокойством: все прямые конкуренты и западные прародители давно канули в лету, что прозрачно намекает на скромный экономический потенциал Шарарама. Подозреваю, что авторы удерживают серверы на плаву ровно из-за тех же сентиментальных побуждений, что движут и мной.

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

Опробовать новинку можно посредством альтернативного клиента на shararam.sadfun.dev (также доступна десктоп-сборка). Искренне надеюсь, что со временем наработки войдут в основной костяк проекта, сделав игру приятнее для каждого. Ниже представлен подробный технический разбор проделанной работы.

Стек Шарарама

Технологический фундамент Шарарама базируется на Adobe Flash Player. Для браузерной многопользовательской игры образца 2009 года это был абсолютно закономерный выбор. Тем не менее, сегодня из-за этого архаичного решения проект сталкивается с двумя фундаментальными трудностями, которые и легли в основу моего исследования.

Первая преграда — полная недоступность в веб-браузерах. Поддержка Adobe Flash была окончательно прекращена повсеместно еще в 2020 году.

Администрация попыталась нивелировать проблему, оставив в браузере Внутренности полной версии

Внутренности полной версии

Под видом «полноценной версии» скрывается Electron-оболочка, в которую принудительно внедрили флеш-плеер. Фактически это специализированный кастомный браузер заточенный строго под Шарарам. В таком виде игра функционирует и по сей день.

Второй критический фактор — катастрофически низкий FPS. В густонаселенных локациях даже топовое современное «железо» захлебывается, выдавая удручающие единицы кадров в секунду.

Виной всему архитектура самого Flash Player. Шарарам целиком построен на векторной графике, расчет и рендеринг которой плеер возлагает исключительно на центральный процессор. На заре релиза это казалось приемлемым из-за скромных разрешений мониторов из нулевых. Но сегодня запускать игру на MacBook или 4K-дисплее — изощренная пытка, не спасает даже понижение графических пресетов.

Ruffle

Закат эпохи Flash оставил в подвешенном состоянии не только Шарарам, но и колоссальный пласт интерактивного наследия прошлых десятилетий. К счастью, энтузиасты разработали Ruffle — передовой эмулятор флеш-плеера, успешно нивелирующий львиную долю старых проблем:

Обеспечивает нативную работу в браузере за счет компиляции в WebAssembly (WASM).
Перекладывает рендеринг графики непосредственно на графический чип (GPU).
Демонстрирует 99-процентную совместимость с виртуальной машиной AVM1 (на ней написан Шарарам) и 82-процентную — с ее программным интерфейсом API (в 2020 году показатели были скромнее, но индустрия не стояла на месте).

Неужели весь этот материал сводится к простой подмене оригинального рантайма на Ruffle?

Увы, нет. Оставался один критический аспект, к которому Ruffle изначально не был готов. Поскольку Шарарам — сетевая игра, нам предстояло заново наладить ее стабильное взаимодействие с сервером.

RTMP

Какими сетевыми протоколами мы привыкли оперировать в веб-среде? HTTP для запросов, WebSocket для дуплексного обмена, WebRTC для голосовой связи, WebTransport как взгляд в светлое будущее (пусть технически это всего лишь HTTP/3). А задумывались ли вы, на чем держалась коммуникация в эпоху расцвета Flash-игр?

Встречайте — RTMP. Википедия позиционирует его преимущественно как инструмент для потоковой трансляции аудио и видеосигналов с веб-камер. Однако в контексте флеш-проектов (не будем вдаваться в детали реализации Шарарама во избежание нарушения пользовательского соглашения) поверх этого протокола развернут полноценный RPC-механизм!

Схема выглядит так: клиент инициирует стандартное незащищенное TCP-соединение, отправляя примерно следующий код:

// ActionScript
var responder = {
    onResult: function(value) {
        trace(value); // 70
    }
};

connection.call("sum", responder, 20, 50);

Флеш-плеер упаковывает эту инструкцию в RTMP-сообщение команды с типом 0x14, сериализуя данные через формат AMF0. На выходе формируется подобная бинарная структура:

03                   # chunk stream ID 3
00 00 00             # timestamp
00 00 22             # payload length: 34 bytes
14                   # message type: AMF0 Command
00 00 00 00          # message stream ID

02 00 03 73 75 6D                       # String "sum"
00 40 00 00 00 00 00 00 00              # Number 2 — transaction ID
05                                      # Null
00 40 34 00 00 00 00 00 00              # Number 20
00 40 49 00 00 00 00 00 00              # Number 50

02 00 07 5F 72 65 73 75 6C 74           # String "_result"
00 40 00 00 00 00 00 00 00              # Number 2 — transaction ID
05                                      # Null
00 40 51 80 00 00 00 00 00              # Number 70

Опытные веб-разработчики уже наверняка уловили подвох. Проблема даже не в том, что Ruffle «из коробки» не умеет работать с данным протоколом. Главное ограничение кроется в современном браузере: сколько ни пиши код, никто не позволит вам открыть «сырой» TCP-сокет напрямую. При этом модифицировать исходный код самого Шарарама мы не имеем права — это прямое нарушение лицензионного соглашения (ToS).

Проксируем Шарарам

Создатели Ruffle предусмотрительно заложили фундамент для решения подобных задач. Эмулятор оснащен бэкендом для сырых сокетов с параметром socketProxy: когда WebAssembly-модуль пытается установить TCP-соединение, запрос заворачивается в бинарный поток WebSocket и уходит на указанный адрес, имитируя прямое сетевое взаимодействие через проксирование.

Однако разработчики Ruffle еще не реализовали встроенную поддержку кодирования и декодирования RTMP-команд. И это неудивительно, если ознакомиться со справкой из Википедии:

В 2009 году Adobe выпустила документ, названный «спецификацией RTMP»^[1], однако описание было нарочито неполно для сдерживания развития альтернативных серверов. Кроме того, для прочтения этого документа требовалось согласиться с лицензионным соглашением, согласно которому допустимо создание RTMP-сервера исключительно по спецификации от Adobe без каких-либо отступлений. В некоторых местах в спецификации указаны намеренно неверные данные

С тех пор сообществу удалось провести лишь качественный реверс-инжиниринг технологии. Не пытаясь изобретать велосипед, я передал задачу своему ИИ-ассистенту Codex со следующими вводными:

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

Нейросеть трудилась над задачей порядка 11 часов, и на рассвете я впервые созерцал Шарарам в разрешении 4K при стабильных 60 FPS! Финальная архитектурная схема оказалась на удивление элегантной:

Хотя процесс аутентификации Смешарика задействует стандартный метод POST shararam.ru/api/user/loqin (сохранена авторская орфография), полученный токен жестко привязывается к клиенту и валидируется при подгрузке ресурсов и RTMP-соединении (судя по всему, с применением TLS/HTTP2 фингерпринтинга). Именно поэтому наш Rust-прокси непрерывно маскируется под официальный клиент. Разумеется, играя на shararam.sadfun.dev, вы доверяете авторизационные данные моему серверу. Если подобный подход вызывает у вас обоснованные сомнения, на GitHub доступна автономная сборка: она поднимает прокси-сервер локально, гарантируя, что конфиденциальная информация не покинет пределы вашего компьютера.

Итог

Для меня этот проект неразрывно связан с личной ностальгией по Шарараму, но концептуально перед нами классический кейс миграции устаревшей браузерной игры с платформы Flash на движок Ruffle. Надеюсь, мой опыт окажется полезным инженерам, столкнувшимся со схожими вызовами, а возможно — и самой команде Шарарама, если они решат вернуть одной из важнейших культурных явления нулевых полноценную жизнь в веб-пространстве. Тем более, что на macOS «родное» приложение перестанет функционировать уже в обозримом будущем, когда Apple окончательно откажется от Rosetta 2. Пересобрать проприетарный Flash под архитектуру ARM сегодня уже объективно невозможно.

Все права на интеллектуальную собственность «Шарарам» и «Смешарики» принадлежат ООО «Смешарики» и защищены соответствующими товарными знаками.

Источник