TANKS
Ретро-аркада · Rust + WebAssembly · играет в браузере

Танковая аркада TANKS

Порт классической танковой аркады: 35 уровней, два игрока за одной клавиатурой, умный ИИ врагов, бонусы и звуки оригинала. Вся игровая логика написана на Rust и скомпилирована в WebAssembly, рендер — Canvas2D со спрайт-атласом. Никаких установок: открой ссылку и играй, на телефоне — тач-джойстик.

Демо Игра tanks.dfv24.com · Управление: стрелки / WASD · огонь Space
60 FPS в браузере · сложность 1–5 · без облаков и регистраций
tanks.dfv24.com · уровень 1
TANKS — бой на первом уровне
Построено на Rust WebAssembly wasm-bindgen Canvas2D React + Vite TypeScript Web Audio Docker + nginx
Возможности

Классика, собранная заново

Механика и повадки оригинала — на современном стеке: быстрый Rust-движок в WASM и лёгкая React-обёртка.

35 оригинальных уровней

Кирпич, сталь, вода, лес и лёд — полный набор тайлов с честным поведением: кирпич крошится посегментно, сталь держит удар, в лесу танки прячутся.

Сложность 1–5

В окне выбора карты — уровень сложности: 5 — «боевая» (исходные параметры), ниже — враги медленнее, стреляют и спавнятся реже. Выбор сохраняется между уровнями.

Два игрока за одной клавиатурой

Кооператив на одном экране: P1 — стрелки + Space, P2 — WASD + свой огонь. Общая база, общий счёт — как на приставке.

Умный ИИ врагов

Scoring-ИИ поверх правил оригинала: враги выбирают цель (игрок, орёл), обходят препятствия, «расталкиваются» на спавне и не толпятся у одной стены.

4 типа врагов и броня

Обычный, быстрый, скорострельный и бронированный — с растущей бронёй на поздних уровнях. Каждый двадцатый несёт бонус, как в оригинале.

Все бонусы оригинала

Звезда (апгрейд пушки), каска, лопата (стальная крепость орла), граната, часы-заморозка и жизнь — с теми же эффектами и таймингами.

Звуки и ритм оригинала

Оригинальные звуковые дорожки через Web Audio: выстрелы, взрывы, бонусы, гул мотора. Кнопка mute — в один клик.

Мобильные и тач

На телефоне появляется тач-D-pad и кнопка огня. Canvas масштабируется под экран, никакого горизонтального скролла.

Rust → WASM: честные 60 FPS

Физика, ИИ, коллизии и FSM игры — в одном WASM-модуле без сборщика мусора. React только грузит модуль и пробрасывает ввод.

Под капотом

Ядро на Rust, оболочка на React

Чистая игровая модель отделена от браузера: её можно тестировать без DOM и рендера.

Игровое ядро

crate — Rust → WASM

Вся логика игры: FSM фаз (Starting → Playing → GameOver/StageEnding → Scores), мир с танками, пулями, бонусами и орлом, ИИ врагов и спавнер. Наружу — компактный wasm-bindgen API.

  • Чистая модель без DOM — юнит-тестится обычным cargo test
  • Детерминированный тик: ввод → ИИ → физика → события
  • Рендер Canvas2D по спрайт-атласу оригинала
  • API: loadStage, tick, render, setPlayerInput, setDifficulty
Оболочка

ui — React + Vite

Лёгкий shell в эстетике DFWebOS: меню, выбор уровня и сложности, игровой экран и таблица очков. WASM-модуль грузится лениво, страницы — через React Router.

  • Клавиатура на двоих + тач-джойстик на мобильных
  • Web Audio: оригинальные .ogg, зацикленный гул мотора
  • Хайскор в localStorage, экран Scores как в оригинале
  • Деплой: один Docker-образ (multi-stage: Rust → Vite → nginx)
Загляните внутрь

Как это выглядит

Реальные экраны с боевого стенда tanks.dfv24.com — меню, выбор уровня и сложность, бой.

Меню

Кирпичный логотип и два режима

Главное меню как на приставке: логотип из кирпичных тайлов, выбор «1 игрок / 2 игрока» жёлтым танком-курсором, управление стрелками и Enter.

tanks.dfv24.com · меню
TANKS — главное меню
Выбор карты

35 уровней и сложность 1–5

Стрелками ←/→ листается уровень, ↑/↓ — сложность: от «слабой» до «боевой». На пятёрке враги в исходной силе, ниже — медленнее, стреляют и появляются реже.

tanks.dfv24.com · выбор карты
TANKS — выбор уровня и сложности
Бой

Кирпич, сталь и орёл под защитой

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

tanks.dfv24.com/play/1
TANKS — бой на уровне 1
Дальше — интереснее

Новые карты, плотнее оборона

С каждым уровнем меняется рисунок стен и состав волны: больше быстрых и бронированных врагов. Клавиши N/B переключают уровни, Enter — пауза.

tanks.dfv24.com/play/7?d=3
TANKS — уровень 7 на средней сложности
Движок

Один тик — вся игра

Каждый кадр браузер зовёт tick(now) в WASM: ядро читает ввод, даёт врагам принять решение, двигает танки и пули, считает коллизии и складывает звуковые события. Затем render() рисует мир по спрайт-атласу на Canvas2D.

  • Детерминированная FSM фаз — от заставки STAGE до таблицы очков
  • ИИ: выбор цели по правилам оригинала + scoring и обходы
  • Сложность масштабирует только врагов: скорость, перезарядку, спавн
  • Звуки — событиями из ядра, проигрывает Web Audio в shell
# кадр игрового цикла (60 раз в секунду)
tick(now) → input P1/P2
ai враги → цель · путь · detour · fire?
physics мир → танки · пули · коллизии · бонусы
eventsзвуки, взрывы, очки

→ render(Canvas2D · sprite-atlas)
→ drainSounds(Web Audio)
✓ 60 FPS без сборщика мусора
Как запустить

От исходников до боя

crate (Rust)

Игровая логика компилируется в wasm32 и оборачивается wasm-bindgen.

ui (React + Vite)

Shell грузит WASM, вешает ввод и рисует меню; vite build собирает статику.

Docker + nginx

Multi-stage образ: build внутри, наружу — лёгкий nginx со статикой.

1

Разработка

make dev — соберёт WASM и поднимет Vite dev-server с горячей перезагрузкой UI. Для ядра — обычный cargo test.

2

Сервер одним скриптом

deploy/create-proxmox-lxc.sh создаёт LXC на Proxmox, ставит Docker и разворачивает игру; либо вручную: docker compose up -d --build.

3

Играйте

Откройте адрес сервера в браузере — на десктопе клавиатура, на телефоне тач. Хайскор хранится локально у игрока.

Репозитории

Исходники проекта

Полные README: сборка, архитектура ядра, формат стейджей и деплой.

Сыграем?

35 уровней, пять сложностей и напарник за той же клавиатурой. Открывается мгновенно — прямо в браузере.

Играть ↗
Демо tanks.dfv24.com · стрелки / WASD · огонь Space · пауза Enter